vue-admin-element
文章平均质量分 62
前端cv大师
这个作者很懒,什么都没留下…
展开
-
element-ui 日期组件 限制可选日期
通过这个属性 来控制有几种方法1.data里面直接定义 pickerOptions1 这个对象data(){ return { pickerOptions1: { disabledDate: (time) => { return time.getTime() < new Date(this.value1).getTime();可选的时间 小于 this.value1 ..原创 2021-10-29 17:09:06 · 1298 阅读 · 1 评论 -
vue 项目中使用 评论功能 带emoji表情包
先看下效果:由于项目中需要做一个 评论的功能,思索一番 准备自己写,但打开度娘 一下就看到这个添加链接描述挺好的,还带表情 刚好满足需求1.安装 2.引入插件3.使用 就不在介绍 上面的链接有记录下我在项目中是怎么使用的以及改了哪些东西这是实际开发项目效果如最上面的效果图这里需要主要几点,关于使用和修改1.你可以 按照上面的步骤 npm安装,2.也可以自己在项目中封装这样一个评论组件,这样你也好改一点如果你是npm 安装的 那么你需要改样式啊,参数啊什么的 ,那简单啊 ,我直接在no原创 2021-01-21 17:35:08 · 4219 阅读 · 5 评论 -
vue+tinymce 实现上传图片和自定义插件
选择富文本插件的时候 还是选择了这个 所见即所得的富文本编辑器 tinymce1.安装tinymcenpm install tinymce -Snpm install @tinymce/tinymce-vue -S如果安装失败,或者报一个 Obj…啥的错误 也许是icon文件没引入,也许是版本不对。在package.json中加上一下的代码 然后npm install "@tinymce/tinymce-vue": "^2.0.0", "tinymce": "^5.0.3",至于原创 2021-01-12 10:51:29 · 5074 阅读 · 0 评论 -
vue+ElementUi 选择框选中之后翻页进行状态保持。及默认选中
表格代码:<el-table:data="list"ref="multipleTable":row-key="(row)=>{ return row.classId}"@selection-change="handleSelectionChange"style="width: 100%"><el-table-column type="selection" :reserve-selection="true" ></el-table-column><转载 2020-11-26 16:26:56 · 1664 阅读 · 0 评论 -
object.assign的使用
项目中经常会将一个对象赋值给另一个对象,我们可以直接使用 = 号 也可以使用es6新增的object.assign这个方法,不同点就是 浅拷贝与深拷贝 引用类型指针的问题今天就遇到一个问题。。。。项目中 父组件 详情页有增加和修改两个按钮 增加和修改公用一个组件 于是在父组件详情页 会调用这个公用的子组件,并将详情的值传过去 以便修改 于是我是这样写的 watch: { orderFormData: { immediate: true, handler(newVal原创 2020-11-25 09:59:07 · 500 阅读 · 0 评论 -
vue 刷新子组件 出现闪屏的问题
项目中 在做表单的开发时 新增或修改需要对表格进行初始化 ,也就是置空表单 有很多方法 ,我是在子组件上加上key 每次打开子组件 key的值都会不一样 这就出现一个问题 每次打开子组件 数据置空是没问题了 总是会闪一下。就好请求数据 还没请求成功页面出现 html代码 一开始使用v-clock 没用!..后来查阅了一番 我一开始将key的赋值放在了 点击事件 也就是点击按钮弹出子组件这个方法中。。需要放在子组件发射的方法中 也就是关闭子组件时,我是在弹出子组件时。 下面调整后的子组件:<tem原创 2020-11-23 10:23:12 · 1999 阅读 · 0 评论 -
vue axios 请求拦截与响应拦截
请求拦截:在我们发送请求给服务器前我们可以做的一些事响应拦截: 请求完成服务器返回我们数据及请求状态,在这里可以对响应统一做处理在使用vue 开发后台管理系统时 自己也是调了半天。1.首先我们引入我们需要的资源import axios from 'axios'import router from '@/router'import { MessageBox, Message,Loading } from 'element-ui'import Qs from 'qs'import store原创 2020-11-23 10:02:21 · 875 阅读 · 0 评论 -
element-ui 使用table current-change这个方法时 选择表格报错
先看下报错子组件 获取父组件的数据 来渲染表格 表格数据是动态的 在子组件用watch 深度监听 来实时渲染排查了半天 找不到报错原因 看了 代码逻辑 没有问题,然后检查current-change这个方法 查资料看到这个 于是 在表格加了一个属性报错问题 解决 …真实不可预测的后果...原创 2020-10-30 11:11:53 · 4255 阅读 · 1 评论 -
去除element-ui中table 的hover效果
.el-table--enable-row-hover .el-table__body tr:hover > td { background-color: rgba(0, 0, 0, 0) !important; }写一个rgb 色值 替换即可原创 2020-10-23 11:39:51 · 11597 阅读 · 2 评论 -
element-ui 获取 select 的label值
<el-select v-model="form.personId" placeholder="请选择负责人 可搜索" @change="getUserName" filterable > <el-option v-for="(item, index) in userList" :key="'i.原创 2020-10-23 11:37:31 · 975 阅读 · 0 评论 -
vue element-ui 封装drawer 抽屉组件
子组件<template> <div class="com"> <el-drawer title="我是标题" :visible.sync="drawer_" :direction="direction"> <span>我来啦! {{task.name}}</span> </el-drawer> </div></template>&l原创 2020-10-23 11:31:20 · 5284 阅读 · 0 评论 -
vue-admin-element学习(四)之elementUi的表格使用
<el-table :data="tableData" style="width: 100%">//---:data="用于存放请求数据回来的数组" <el-table-column label="索引值" width="400"> <template slot-scope="scope">//--- 这里取到当前单元格 <span>{{ scope.$index }}</span>//--- s原创 2020-08-27 10:32:01 · 1517 阅读 · 0 评论 -
vue-admin-element 搭建后台管理系统学习(三)权限之动态渲染侧边栏
在后台管理系统中权限分配角色权限之类的是必不可少的,项目用的是vue-admin-element一个后台基础模板,关于权限路由在vue-element-admin集成模板中有详细的代码,这里是我在项目中开发学习整理的。以下内容是用户的粗粒度权限,关于细粒度(按钮级)权限的可以根据token来限制。主体逻辑:前端有两个路由表,一个constantRoutes(全部成员可访问)一个asyncRoutes(需要权限访问)用户登录有返回一个token,拿到token请求用户信息,用户信息中返回当前角色拥有的原创 2020-08-26 14:44:04 · 1911 阅读 · 1 评论