![](https://img-blog.csdnimg.cn/20200507161711382.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
Vue
vue相关
RightHereWaitingFY
这个作者很懒,什么都没留下…
展开
-
超实用:Vue 自定义指令合集
https://mp.weixin.qq.com/s/V4P_FipfmDu1_LA1RvzU7g原创 2021-08-02 09:19:06 · 85 阅读 · 0 评论 -
模块modules及获取根部数据或方法
https://www.jianshu.com/p/c593a6121418原创 2021-07-20 08:57:00 · 220 阅读 · 0 评论 -
VUEX ...map
computed: { ...mapState({ active: state => state.active, }) ...mapGetters(["sidebarRouters", "sidebar"]),},methods:{ ...mapMutations(['***','***']) ...mapActions(['***']),}原创 2021-05-18 10:21:09 · 162 阅读 · 0 评论 -
前端 平级结构数据转换 el-tree 所要求的树形结构数据
var testData = [{ component_id: "", isParent: true, name: "调查问卷", id: "questionnaire" }, { component_id: "questionnaire", name: "限制规则", id: "82d7c72ce0d44d468917d80345db6d76" }, { component_id: "questionnaire", name: "问卷状态", id: "37df原创 2021-03-23 16:18:12 · 485 阅读 · 0 评论 -
element ui触发单个验证
this.$refs.ruleForm.validateField(‘type’)原创 2020-10-26 10:10:44 · 1015 阅读 · 0 评论 -
VUE elementUI calendar 根据日期段标记日期
<template> <div class='outer'> <main> <el-calendar> <template slot="dateCell" slot-scope="{date, data}"> <!-- {{data.day}} --> <p :class="data.isSelected ? 'is-selected原创 2020-10-09 10:20:42 · 1487 阅读 · 1 评论 -
vue自定义指令preventReClick防止多次点击,针对于elementUI button
1、定义全局指令文件 Vue.directiveimport Vue from 'vue'// 自定义指令防止按钮重复点击 v-preventReClick(使用时)const preventReClick = Vue.directive('preventReClick', { inserted: function (el, binding) { el.addEventListener('click', () => { console.log(11111) c原创 2020-09-30 11:16:06 · 3451 阅读 · 3 评论 -
elementUI calendar日历事例
标记日历<template> <div class='outer'> <el-calendar v-model="value"> <template slot="dateCell" slot-scope="{date, data}"> <!-- {{data.type}} --> <!-- {{data.isSelected}} --> &l原创 2020-09-30 11:08:40 · 857 阅读 · 0 评论 -
Vue 全局时间过滤器
// 全局的时间过滤器Vue.filter('dateFormat',function(originVal){ // 提到需要过滤的日期 const date = new Date(originVal) // 获取年份 const Y = date.getFullYear() // 获取月份 如果不足两位,在前面以0来补全 const M = (date.getMonth() + 1 + '').padStart(2,'0') // 获取日 如果不足两位,在前面以0来补全原创 2020-05-08 22:08:08 · 275 阅读 · 0 评论 -
vue输入一位数字转汉字
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigi...原创 2019-12-12 10:26:57 · 498 阅读 · 0 评论 -
本地创建vue项目
1、安装nodejs2、安装webpack安装命令:cnpm install webpack -g安装完成,通过webpack -v来查看当前webpack版本3、安装全局的vue-cli脚手架,用于帮助搭建所需的模板框架安装命令:npm install -g vue-cli安装完后,可以输入vue,或者vue -V,然后回车,如果出现vue的信息,则说明安装成功了。4、创建项目进...原创 2020-04-24 18:10:32 · 192 阅读 · 0 评论 -
常规删除逻辑
// 删除权限async removeRightsById(roles,rightId){ // 弹出confirm提示框 const comfimResult = await this.$confirm('删除权限,是否继续','提示',{ confirmButtonText: '确定', cancelButtonText: '取消', type: 'warn...原创 2020-05-07 16:44:18 · 151 阅读 · 0 评论 -
增加或修改前校验
// 首页对addRolesFormRef进行校验this.$refs.addRolesFormRef.validate(async valid => { // 校验失败,直接返回 if(!valid) return // 校验成功,发起请求 const {data:res} = await this.$http.post('roles',this.addR...原创 2020-05-07 16:41:49 · 179 阅读 · 0 评论 -
Axios基本使用
// 导入axios并配置baseUrlimport axios from 'axios'axios.defaults.baseURL = 'http://127.0.0.1:8888/api/private/v1/'// axios 添加请求拦截器axios.interceptors.request.use(config => { // console.log(config);...原创 2020-05-07 16:22:12 · 105 阅读 · 0 评论 -
VueRouter全局路由守卫
// 挂载路由导航守卫 全局路由守卫router.beforeEach((to,from,next) => { // to 将要访问的路径 // from 代表从哪个路径跳转而来的 // next 是一个函数 表示放行 next()直接放行 next('/login')强制跳转 // 如果将要访问的页面是/login,则直接放行 if(to.path ===...原创 2020-05-07 16:19:40 · 142 阅读 · 0 评论