element UI
杰瑞LJ
这个作者很懒,什么都没留下…
展开
-
vue Dom元素执行change事件,给其他元素赋值后,被赋值的元素,再次修改输入或选择没有及时回显问题
如图 ,左边选择,给右边赋值,右边输入框赋值后,再次输入修改时,无法及时回显解决 被赋值的元素再次输入修改时,无法及时回显问题两种方法 :1、可能是因为我这个被赋值的元素层级太深,不要搞太多层,直接定义formData,放进里边就行修改后:this.formData.useStage = item.useStage; 经测试可行。2、由于数据太多,换层级有点伤筋动骨,遂用另一种方法,直接在没有及时回显的元素上 加change事件,强制它回显。<el-input v-model="原创 2020-09-08 18:02:15 · 1800 阅读 · 0 评论 -
el-tabel树形表格,指定列折叠展开 row-key=“id“ :tree-props=“{children: ‘children‘, hasChildren: ‘hasChildren‘}“
树形表格展示 通过设置row-key=“id” :tree-props="{children: ‘children’, hasChildren: ‘hasChildren’}"默认是第一列,显示折叠展开的符号 通过 **type=""**来指定拿列显示 符号,比如 想指定第4列,就把前边3列都加上 type =""代码...原创 2020-08-04 11:03:29 · 11530 阅读 · 8 评论 -
封装vue组件保错 Component template should contain exactly one root element. If you are using v-if ......
创建vue 公共组件时报错原因:缺少根元素!组件中不管写多少内容,最外层一定要给一个div标签把所有包含起来示例 将上传附件封装为组件html中引入vue封装组件时,组件名字必须全部使用小写,大写无法编译webpack组建化形式开发 名字可大写Vue.component('upload-file',{ template:'<div>\n' + ' <div class="row ten">\n' + ' <原创 2020-08-01 15:20:05 · 304 阅读 · 0 评论 -
el-cascader 级联选择器,单选按钮要选两次按钮才选中
可通过 props.checkStrictly = true 来设置父子节点取消选中关联,从而达到选择任意一级选项的目的。为公共组件时 ,不要加v-model原创 2020-07-20 18:33:40 · 3295 阅读 · 6 评论 -
vue element form表单规则验证,有值,但验证始终不消失
有值验证不消失的效果图1.检查v-model绑定值和prop属性绑定值是否相同(1)绑定值(2)规则(3)规则与值相同,是对的到这步一般就能解决,但我的问题没解决2.想到选择赋值之后,取消这项验证//取消单项验证this.$refs.dataForm.clearValidate('dutyPerson');well,well,well还是不消失3.点击弹出窗口时,强行赋个空值// 新增 add() { this.dialog.title = "新增档案原创 2020-07-09 10:04:01 · 12717 阅读 · 2 评论 -
element ui日期时间选择器el-date-picker 禁止选择当前日期之前的日期
效果图代码 picker-options设置禁用日期<el-date-picker type="datetime" :picker-options="pickerOptions" value-format="yyyy-MM-dd HH:mm:ss" v-model.trim="dialog.data.returnTime" style="width: 100%;"></el-date-picker>data() { return { picker原创 2020-07-03 11:33:59 · 10897 阅读 · 1 评论 -
vue element-ui组件 el-tree 树菜单 鼠标滑过mouseenter,mouseleave移入移出节点,显示操作按钮 新增,删除等
效果图表单,加入 移入移出事件 mouseenter,mouseleave,用v-show 定义显示<el-tree class="filter-tree tree" ref="tree" highlight-current :expand-on-click-node = "false" :data="categories"原创 2020-06-11 09:48:25 · 5092 阅读 · 1 评论 -
vue element-ui v-for循环el-upload上传图片 动态添加、删除
表单元素<el-row v-for="(v,i) in RecordOperation.imgList" :key="i"> <el-col :span='11'> <el-form-item label="图片"> <el-upload accept="image/jpeg,im.原创 2020-06-10 16:44:17 · 5978 阅读 · 0 评论 -
el-table 时间格式转换--天数时分秒倒计时显示
/** * 带天数的倒计时 * @param times 秒数 * @param data 数据集合 */countDown(times, data){ var timer=null; timer=setInterval(function(){ var day=0, hour=0, minute=0, second=0;//时间默认值 .原创 2020-06-04 17:30:01 · 1671 阅读 · 0 评论 -
element ui el-tree 新增 删除节点
效果图<el-tree class="filter-tree" ref="tree" highlight-current :expand-on-click-node = "false" :data="categories" :filter-node-method原创 2020-05-21 10:49:14 · 7504 阅读 · 3 评论 -
element el-upload上传的附件名称不显示 file-list赋值
问题:上传附件后 文件名字不显示解决:1、首先看file-list 是否在data中定义2、如果定义了,文件名字还是不显示,在获取数据之后,把文件名字push到fileList中去,给name值赋值就可以显示了。 this.fileList.push({ name: '', ...原创 2020-03-25 11:30:34 · 19305 阅读 · 2 评论 -
element ui el-upload上传附件,删除,预览,上传前验证,删除前验证
表单项:file-list=“fileList” 上传附件显示文件名称limit=“1” 限制上传数量为1<el-form-item label="附件"> <el-upload class="upload-demo" ...原创 2020-03-24 16:50:18 · 5578 阅读 · 1 评论 -
element el-tree 树筛选赋值
表单项:<el-form-item label="报告人" prop="reporter"> <el-col :span="18"> <el-input v-model.trim="dialog.data.reporterId" style="display: n...原创 2020-03-24 16:31:00 · 2047 阅读 · 0 评论 -
el-table固定列 fixed
将操作列固定在右侧 在列中 加 fixed=“right”<el-table-column label="操作" fixed="right" align="center" width="100"> <template slot-scope="scope"> <el-button @click="view(sco...原创 2020-03-24 15:51:08 · 5454 阅读 · 1 评论 -
el-table-column自定义标题 换行
在标题要换行的列中添加 :render-header=“renderheader” ,要换行的文字后 加符号“-”(与方法中定义的符号一致)<el-table-column prop="" :render-header="renderheader" label="最高地价-(万元/亩)" width="90" align="right"></el-table-column...原创 2020-03-24 15:47:51 · 1618 阅读 · 0 评论 -
vue el-table 表格自适应窗口
vue el-table 表格自适应窗口表格 高度 设变量 tableHeightdata:{//初始值screenHeight: document.body.clientHeight,//屏幕高度tableHeight:window.innerHeight - 300,//table高度},//页面尺寸发生变化时,修改表格高度mounted() {window.onresi...原创 2020-03-20 14:28:05 · 2655 阅读 · 1 评论 -
element Uncaught (in promise) cancel
this.$confirm() 确认框点击取消时报错:Uncaught (in promise) cancel解决方法:没有加catch(),加上之后就不会报错了this.$confirm('确定删除?', '提示', { confirmButtonText: '确定', cancelButtonText: '取消...原创 2019-12-23 14:00:01 · 313 阅读 · 0 评论 -
element table滚动加载+vue自定义指令
element table滚动加载+vue自定义指令1、首先自定义 一个全局滚动加载指令 命名为: loadmore2、在 el-table 中调用loadmore指令: v-loadmore="loadMore"3、加载数据loads()1、首先自定义 一个全局滚动加载指令 命名为: loadmore.el-table__body-wrapper是加载容器,获取向下滚动距离,和左滑距离,只有...原创 2019-12-23 11:37:38 · 1076 阅读 · 1 评论