Closed oubohua closed 9 months ago
我是模拟了获取数据,默认选中的
<template>
<div>
<el-button type="primary" @click="setTreeValue">赋值</el-button>
<vue-easy-tree
ref="veTree"
node-key="id"
height="400px"
:data="treeData"
:props="props"
:show-checkbox="true"
:default-expanded-keys="['abc']"
:default-checked-keys="checkSelectKeys"
></vue-easy-tree>
</div>
</template>
<script>
import VueEasyTree from "@wchbrad/vue-easy-tree";
import "@wchbrad/vue-easy-tree/src/assets/index.scss";
export default {
name: "Test",
props: [],
data() {
return {
props: {
label: "name",
children: "children",
},
checkSelectKeys: [],
treeData: [],
};
},
components: { VueEasyTree },
created() {},
mounted() {
this.setTree();
},
methods: {
setTree() {
let arr = [];
for (let i = 0; i < 20000; i++) {
arr.push({ id: `id-${i}`, name: `name-${i}` });
}
let tree = [{ id: "abc", name: "全部", children: arr }];
this.treeData = tree;
},
setTreeValue() {
let arr = [];
for (let i = 10; i < 3000; i++) {
arr.push(`id-${i}`);
}
this.checkSelectKeys = arr;
// this.$refs.veTree.setCheckedKeys(arr);
},
},
};
</script>
<style lang="scss" scoped>
</style>
用以下代码替换setTreeValue方法
setTreeValue() {
let arr = [];
for (let i = 10; i < 3000; i++) {
arr.push(`id-${i}`);
}
const allNodes = this.$refs["veTree"].store._getAllNodes();
for (const node of allNodes) {
if (arr.includes(node.key)) {
node.checked = true;
}
}
},
这个方法可以
这个还有点小问题,父级没有半选的状态。
你是一次全选么?贴一个最小化复现代码