需求:
1、el-tree至多选10个,超过后无法再勾选
2、当勾选父节点时不自动勾选子节点;
3、点击清除,清除所有勾选项
<el-tree :data="treeData" ref="treeRef" @check="handleTreeCheck"
default-expand-all :check-strictly="true"
show-checkbox node-key="id" :props="defaultProps">
</el-tree>
handleTreeCheck (currNode, checkedInfo) {
let checkedKeys = checkedInfo.checkedKeys || [];
let treeNodesMap = this.$refs.treeRef.store?.nodesMap || {};
let status = checkedKeys.length >= 10
if (status) {
this.$message.warning('最多只能选择10个!')
}
Object.keys(treeNodesMap).forEach(key => {
let item = treeNodesMap[key] || {};
if (!checkedKeys.includes(key)) {
let data = item.data || {};
data.disabled = status;
this.$refs.treeRef.setCurrentNode(data);
}
})
}
//清除
clearTreeSelect() {
this.$refs.treeRef.setCheckedKeys([]);
}