element-ui tree 根据不同叶子节点设置是否显示复选框
公司业务要求不同根节点配置显示与否复选框,官方文档没有这样的配置,所以想到了修改element-ui源码。
1.这里将“node_modules\element-ui\packages”下的tree文件夹整体复制到自己的项目目录(customComponent)中
2.修改tree.vue
<el-checkbox
v-if="showCheckbox"
:style="{ 'visibility': node.data.leaf?'hidden':'visible' }"
v-model="node.checked"
:indeterminate="node.indeterminate"
:disabled="!!node.disabled"
@click.native.stop
@change="handleCheckChange"
>
</el-checkbox>
<!-- 上面第三行是我添加的,node.data.leaf是后台传过来的标识,用来判断是否显示复选框,大家根据自己的树数据进行更换 -->
3.在使用到tree组件的文件中引入tree.vue,并且声明一下就可以使用了,跟使用<el-tree>的方式一样。
参考文章:https://www.jianshu.com/p/5290ef00829f
element-ui tree 根据不同叶子节点设置是否显示复选框的更多相关文章
- DOM(十)使用DOM设置单选按钮、复选框、下拉菜单
1.设置单选按钮 单选按钮在表单中即<input type="radio" />它是一组供用户选择的对象,但每次只能选一个.每一个都有checked属性,当一项选择为t ...
- ElementUi tree 指定节点是否显示复选框
场景:树的内容是省份下面的城市有酒店 需求:只能多选酒店(为了删除它们),至于为啥不能选省份或者城市更加灵活的去删除相应酒店,这你得去问后台0.0,他只弄了根据酒店id去删除.嗯,连创建酒店的时候级联 ...
- Qt树形控件QTreeView使用1——节点的添加删除操作 复选框的设置
QtreeView是ui中最常用的控件,Qt中QTreeWidget比QTreeView更简单,但没有QTreeView那么灵活(QTreeWidget封装的和MFC的CTreeCtrl很类似,没有m ...
- 【zTree】zTree根据后台数据生成树并动态设置前面的节点复选框的选中状态
0.页面中准备树的ul <ul id="treeDemo10" class="ztree" style="display: none;" ...
- Element ui tree树形控件获取当前节点id和父节点id
低版本Element ui tree树形控件获取当前节点id和父节点id的方法:点击查看 最新版本Element ui tree树形控件获取当前节点id和父节点id教程: 1.找到node_modul ...
- 判断easyUI tree 节点复选框是否被选中的方法。将选中的节点高亮显示的方法
在datagrid tree中如何判断某个节点的复选框是否被选中? 我们可以通过HTML结构去分析: 1.节点未选中前 2.节点选中后 所以节点被选中前和选中后,html中的class类是用区分的. ...
- 关于textjs的tree带复选框的树
通过查阅一些资料和自己之前了解到的一些相关知识,有时项目中需要用到.话不多说,先看一下效果图: 我写的这人员选择的树,主要是改写了TreePanel,如下代码: ExtendTreePanel.js ...
- 转 纯CSS设置Checkbox复选框控件的样式
Checkbox复选框是一个可能每一个网站都在使用的HTML元素,但大多数人并不给它们设置样式,所以在绝大多数网站它们看起来是一样的.为什么不把你的网站中的Checkbox设置一个与众不同的样式,甚至 ...
- php部分--例子:租房子(复选框的全选、数组拼接成字符串、设置复选框的name值、)
1.链接数据库 <?php include("DBDA.class.php"); $db=new DBDA(); $sql="select * from fangz ...
随机推荐
- Linux常用命令3 文件搜索命令
文件搜索非常占用资源,所以尽量不要使用这个命令 避免少用该命令最好的方式是设置好文件夹结构,文件不要乱放 1.文件搜索命令:find 命令名称:find 所在路径:/bin/find 执行权限:所有用 ...
- V8引擎实现标准ECMA-262(三)
推荐英文原址ECMA-262 3.构造函数 构造函数除了通过指定的模式创建对象以外,还有另外一个好处--它能够自动设置新创建对象的原型对象,这个原型对象存储在构造函数的Prototype属性中. 例如 ...
- 【JZOJ4799】【NOIP2016提高A组模拟9.24】我的快乐时代
题目描述 输入 一行,两个整数l,r . 输出 一行,一个整数,表示第l 天到第r 天的愉悦值的和. 样例输入 64 89 样例输出 1818 数据范围 解法 可以参考数位动态规划的想法. 从个位开始 ...
- Directx11教程(33) 纹理映射(3)
原文:Directx11教程(33) 纹理映射(3) 现在我们在myTutorialD3D11_5的基础上,来逐步编码实现纹理映射,之所以在myTutorialD3D11_5基础上改写,是 ...
- Handler, AsyncTask用法简单示例
package com.jim.testapp; import android.app.Activity; import android.os.AsyncTask; import android.os ...
- 易位构词EOJ3451【字符串】【思维题】【模拟】
http://acm.ecnu.edu.cn/problem/3451/ 官方题解: 我们可以先考虑字符串有序的情况,比如是 aaabcc,我们只要将字符串右移 3 位,变成 bccaaa,就做完了. ...
- Android开发-API指南-<activity-alias>[原创译文]
http://blog.sina.com.cn/s/blog_48d491300100zmg5.html
- iOS 三种打电话方式
//1,这种方法,拨打完电话回不到原来的应用,会停留在通讯录里,而且是直接拨打,不弹出提示 NSMutableString * str=[[NSMutableString alloc] initWit ...
- 利用IDEA构建springboot应用-构建好SpringBoot + SSM 框架
一. 创建项目 选择 Spring Initiallizr 添加最基本的几个依赖 Web,MySQL,MyBatis,其他需求可以后续再添加 ; 数据库选择了 MySQL 二. 配置数据源 数据源中存 ...
- Spring Security 4 使用@PreAuthorize,@PostAuthorize, @Secured, EL实现方法安全
[相关已翻译的本系列其他文章,点击分类里面的spring security 4] 上一篇:Spring Security 4 整合Hibernate 实现持久化登录验证(带源码) 原文地址:http: ...