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>的方式一样。