关于前端:eltree回显问题

看上面代码,el-tree中回显问题,暗藏的弹窗中曾经有全副的权限,当初在点击编辑权限,弹窗展现,默认勾选出曾经选中的权限


       let selectId = res.data.data.checkList; 权限id以后领有 [1,2,3]
        this.$nextTick(() => {
          selectId.forEach((item) => {
            const node = this.$refs["menuListTree"].getNode(item);  依据id获取对应node节点
            if (node?.isLeaf) {   isLeaf 这个属性意思是如果是叶子节点就是true,而后能够依据这个设置回显,那么他父节点会主动半选或者全选依据叶子节点
              this.$refs["menuListTree"].setChecked(node, true);
            }
          });
        });

这个代码我感觉逻辑是没有问题的,返回全副权限id,而后依据getNode(id)获取对应的node节点,而后node节点上有一个属性isLeaf, true的话这个节点就是叶子节点,那么就设置这个节点setChecked
选中,而后父节点会依据叶子节点的状况主动半选或者全选,

然而成果就不尽人意,

我在思考是不是这时候dom还没渲染实现呢,然而我加了nextTick呀,所以我后面有加了一个定时器,而后奇观就呈现了

  let selectId = res.data.data.checkList; //权限id以后领有 [1,2,3]
     setTimeout(() => {
          this.$nextTick(() => {
          selectId.forEach((item) => {
            const node = this.$refs["menuListTree"].getNode(item); //依据id获取对应node节点
            if (node?.isLeaf) { //isLeaf 这个属性意思是如果是叶子节点就是true,而后能够依据这个设置回显,那么他父节点会默认半选或者全选依据叶子节点
              this.$refs["menuListTree"].setChecked(node, true);
            }
          });
        });
     }, 100);

看到能获取到node节点,并且能选中了

所以想问下大家,这里到底怎么写好,这个起因是什么?

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理