官网自带的禁用状态: 可将 Tree 的某些节点设置为禁用状态
通过disabled :true设置。 可将 Tree 的某些节点设置为禁用状态
如下:
<script>
export default {
data() {
return {
data: [{
id: 1,
label: '一级 2',
children: [{
id: 3,
label: '二级 2-1',
children: [{
id: 4,
label: '三级 3-1-1'
}, {
id: 5,
label: '三级 3-1-2',
disabled: true
}]
}, {
id: 2,
label: '二级 2-2',
disabled: true,
children: [{
id: 6,
label: '三级 3-2-1'
}, {
id: 7,
label: '三级 3-2-2',
disabled: true
}]
}]
}],
defaultProps: {
children: 'children',
label: 'label'
}
};
}
};
</script>
但是有的需求前端用起来并不是太好用!
但是呢props绑定的对象中可以实现灵活禁用!
<el-tree :data="list" show-checkbox node-key="id" :props="defaultProps" ref="tree" @check='addterrFn'>
</el-tree>
defaultProps: {
children: 'Child',
label: 'Name',
disabled: this.isdisabledFn,
},
isdisabledFn() {
return true
},