el-tree 回显undefined问题？

  • Z时代
  • 2024-02-11
  • 分类：IT

HTML代码：

<el-tree
    ref="tree"
    style="min-height: 300px"
    show-checkbox
    :indent="0"
    :data="treeData"
    :props="treeProps"
    node-key="id"
    :default-expand-all="true"
    :default-checked-keys="checkedMenuIds"
    :render-content="renderContent"
    @node-expand="handleExpand"
    @check="handleBucketClick"
  >
</el-tree>

获取已勾选的id：

getRoleMenus() {
      getMenuAuthList({
        roleId: this.form.roleId,
        appId: this.form.appId,
      }).then((res) => {
        // 获取授权后id回显
        this.$nextTick(() => {
          setTimeout(() => {
            let arr1 = [];
            let arr2 = [];
            res.menuReq.forEach((i) => {
              if (i.btnIds) {
                arr1.push(i.menuId);
                i.btnIds.map((j) => {
                  arr2.push(j);
                });
              }
            });
            this.checkedMenuIds = [...arr1, ...arr2];
            this.$refs.tree.setCheckedNodes(this.checkedMenuIds); //给树节点赋值
            console.log('回显', this.$refs.tree.setCheckedNodes(this.checkedMenuIds));
          }, 0);
        });
      });

上面方法是在点击选中下拉框值的时候调用：

// 选择角色
handleRoleChange() {
  if (this.form.roleId) {
    getMenuList({
      appId: this.form.appId,
    }).then((res) => {
      if (!res) return;
      this.treeData = res;
      this.$nextTick(() => {
        this.getRoleMenus();
        this.changeCss();
      });
    });
  } else {
    this.treeData = [];
  }
  this.checkedMenuIds = [];
},

但是打印this.$refs.tree.setCheckedNodes(this.checkedMenuIds));一直显示的是undefined，一开始我以为是this.$refs.tree问题，打印也可以获取到。

因为这个this.$refs.tree.setCheckedNodes(this.checkedMenuIds));一直是undefined，导致回显有问题，所以请假大佬们，该怎么解决？

想不通为啥

回答：

人家的setCheckedNodes就没有设置返回值，你打印当然一直是undefined了

你应该检查你的checkedMenuIds数据是个啥，能不能跟treeData匹配。另外setCheckedNodes的参数应该是tree节点的数据集合，setCheckedKeys的参数应该是tree节点的id集合，这两个要分清楚应该用哪个

以上是 el-tree 回显undefined问题？ 的全部内容， 来源链接： utcz.com/p/933260.html

回到顶部