avue中的tree设置节点不可选中
avue中的tree设置节点不可选中
·
最近在使用avue-tree的时候 由于需求问题 最高节点不可选中 看了一下文档没有disabled这个属性 百度了一下也没有得到解决 就自己写了一个
下面是html代码
<span class="el-tree-node__label" slot-scope="{ node, data }">
<span>
<i class="assets-ico"
:style="{border:data.grade == 1?'1px solid #ccc':'1px solid #FE9000'}">
<span class="assets-span"
:style="{color:data.grade == 1?'#ccc':'#FE9000'}">
{{data.grade == 1?'集':data.grade == 2?'园':data.grade == 3?'产':data.grade == 4 || data.grade == 5?'线':'段'}}</span></i>
<span :style="{color:!data.isSelected?'#ccc':''}"> {{ node.label }}</span>
</span>
</span>
然后我们需要在data中定义一个默认选中的Id 就称为id
在初始化树的时候把第一个默认选中的id赋值
this.id= this.treeData[0].children[0].id;
我这里默认选中第一个父级的第一个后代
然后在点击事件中设置选中不可选的时候默认选中上一个
nodeByPositionClick(data, node) {
if(data.grade == 1){
this.$message.error("无法选择集团!");
this.$nextTick(() => {
this.$refs.normalTree.setCurrentKey(this.id)
})
return false
}
this.id= data.id;
},
更多推荐
已为社区贡献2条内容
所有评论(0)