php form 添加滚动条,element 使用总结(1. tree使用 2. table修改滚动条样式 3. el-form 自定义label添加icon)...
一, vue_elementUI_ tree树形控件
1.默认点击tree节点的第一个(注意不是checked选中)
@node-drop="handleDrop"ref="fileTree"draggable>
{{ node.label }}
@node-click点击事件 :highlight-current高亮 :expand-on-click-node点击展开按钮展开点击行不展开
node-key id作为唯一标识 default-expand-all默认全部展开 @node-drop 拖拽事件 draggable 可拖拽 ref tree的唯一标识
1,添加高亮属性 :highlight-current="true"
2,添加tree的“ref”属性 ref="treeBox"
3,添加唯一标识的字段 node-key="id"
4,设置默认选中
let para ={keyword:this.searchFileData};
taskFileList(para).then(res=>{if(res.data.code == 200) {this.fileData =res.data.model;this.$nextTick(() =>{this.$refs.fileTree.setCurrentKey(this.fileData[0].id);
});this.loadList();
}else{this.$notify({
title:"错误",
message: res.data.msg,
type:"error"});
}
});
2. 获取选中的父节点ID
el-tree 的 this.$refs.tree.getCheckedKeys() 只可以获取选中的id 无法获取选中的父节点ID
想要获取选中父节点的id;需要如下操作
1. 找到工程下的node_modules文件夹 然后查找 element-ui.common.js文件
node_modules\element-ui\lib\element-ui.common.js
2. 按Ctrl+F搜索TreeStore.prototype.getCheckedKeys这个方法
3. 把
// if (child.checked && (!leafOnly || leafOnly && child.isLeaf)) {
// checkedNodes.push(child.data);
// }
改为
if ((child.checked || child.indeterminate) && (!leafOnly || leafOnly && child.isLeaf)) {
checkedNodes.push(child.data);
}
如下图:
二,table滚动条样式修改
//el-table 修改滚动条样式开始
.tableBoxs .el-table__body-wrapper::-webkit-scrollbar {
width: 8px;
height: 8px;
}
//滚动条的滑块
.tableBoxs .el-table__body-wrapper::-webkit-scrollbar-thumb {
background-color: #D5D5D5;
border-radius: 4px;
}
//el-table 修改滚动条样式结束
el-form 自定义label添加icon
菜单名称
php form 添加滚动条,element 使用总结(1. tree使用 2. table修改滚动条样式 3. el-form 自定义label添加icon)...相关推荐
- Ant Design Table修改滚动条样式
Ant Design Table修改滚动条样式 目录 一.目的 二.步骤 1.了解滚动条的组成部分 2.样式修改 3.实现效果 二.总结 目录 一.目的 修改Ant表格的固定列滚动而产生的滚动条样式, ...
- iview的table修改滚动条样式
修改iview table组件的滚动条 /deep/::-webkit-scrollbar {width: 6px; //竖轴宽度height: 6px; //横轴宽度background-color ...
- element table for循环出来设置fixed,table底部滚动条无法拖动
element table for循环出来设置fixed,table底部滚动条无法拖动 element 的table 如果用for循环出的,设置fixed后,有可能会导致底部滑动失效,这是因为elem ...
- Element ui table组件滚动条隐藏与样式修改
Element ui 虽然用起来方便,但是调整就比较麻烦了,尤其是这个table组件,一旦设定了height属性,数据多的时候就会自动出现滚动条,如果你改了其他的样式,这个滚动条就是十分难看,可以用下 ...
- Element Tree 树形控件自定义显示样式与hover事件绑定实现添加、删除和修改
Element Tree 树形控件自定义显示样式与hover事件绑定实现添加.删除和修改 最近在搞erp项目对应后台的管理功能,为了加速开发使用了 vue-element-admin 开发,使用的是e ...
- 自定义View添加滚动条
1.在xml中调用自定义View Android自定义控件是通过继承View类实现的,新建一个View类的子类,然后重写ondraw方法,加入你创建的类名为(MyView),那么在Activity中S ...
- vue ui无效_vue开发中,父组件添加scoped之后。解决在父组件中无法修改子组件样式问题。...
在vue的开发中,我们需要引用子组件,包括ui组件(element.iview).但是在父组件中添加scoped之后,在父组件中书写子组件的样式是无效果的.去掉scoped之后,样式可以覆盖.但这样会 ...
- iframe修改滚动条样式
** iframe修改滚动条样式 ** 1.引入后添加iframe页面或url 2.*如对本身自带的滚动不满意 可到引入源文件进行添加样式
- html5滚动条样式修改,css修改滚动条样式
在css中怎样改变滚动条的样式 /*IE滚动条颜色设置*/body {scrollbar-arrow-color:#f2f2f3;/*上下箭头*/scrollbar-track-color:#1589 ...
最新文章
- 9.9元,2顿饭?中国的食品黑科技搞出了可以直接“喝的饭”
- Amazon Aurora 升级, 兼容 PostgreSQL
- python socket server库_python基础之socket与socketserver
- 融入产业生态的靶向孵化
- 连续连通域检测算法的MATLAB仿真
- Ubuntu14.04引导菜单修复
- vue.js源码学习分享(五)
- 【Python】pyCryptodome模块实现AES加密、解密
- 文档浏览网站 Docs4dev,内含Spring、SpringBoot、Spring Data等中英文文档
- (三)Mybatis类型转换器,接口传参类型,一对一,一对多查询resultMap配置
- linux 生成bmp,linux下生成bmp图片的测试程序
- python 元类理解
- 弘辽科技:拼多多top店铺是什么意思?怎么运营?
- 微信小程序 - 修改 button 边框和背景色
- 转载的一篇嵌入式大佬经验博文
- Kibana查询语言(KQL)
- webpack原理篇(六十二):实战开发一个自动合成雪碧图的loader
- Linux 多线程开发(附有案例代码)
- windows php gd 支持,windows服务器开启php的gd库方法
- 词云库学习--python习题
热门文章
- excel 切片器 html,excel切片器怎么使用2010
- oracle odi 资料档案库访问期间出现未分类的异常错误,oracle学习_基本语法
- java显示毫秒改成分钟_【转】java获取当前年、月、日 、小时 、分钟、 秒、 毫秒...
- 玩转SpringBoot 2.x 解析BeanPostProcessor原理篇
- spring配置数据源的4种方式--简介
- 基于JAVA+Servlet+JSP+MYSQL的问卷调查管理系统
- 基于JAVA+SpringMVC+Mybatis+MYSQL的医院预约挂号系统
- oss批量上传工具_OssExplorer一OSS的专用客户端工具【最新版】_Windows_Windows server 2008-云市场-阿里云...
- ASP.NET Core学习——5
- MySQLSyntaxErrorException: Table 'taotao.tbuser' doesn't exist