如何把得到的数据填充到el-tree中，让某些复选框处于选中状态？

问题

已经获取到了数据了，如何把它填充到el-tree中，让某些个复选框处于选中状态？

解决方案

在el-tree组件中通过setCheckedKeys方法 + node-key将数据 回显到el-tree组件中：处于选中状态

实现步骤

1. 给tree补充属性node-key

<!-- 权限点数据展示 -->
    <el-tree
      ref="refTree"
      :data="permissionData"
      :props="{ label: 'name' }"
      :default-expand-all="true"
      :show-checkbox="true"
      :check-strictly="true"
+     node-key="id"
    />

2. 调用setCheckedKeys

// 获取角色现有的权限
    async loadRoleDetail() {
      const res = await getRoleDetail(this.roleId)
      console.log('获取角色现有的权限', res.data.permIds)

      // 回填
      this.$refs.refTree.setCheckedKeys(res.data.permIds)
    },

3.具体实现效果
点击角色，弹框打开，就可看到该角色已经具备哪些权限

小结

setCheckedKeys：通过 keys 设置目前勾选的节点，使用此方法必须设置 node-key 属性。(keys, leafOnly) 接收两个参数，1. 勾选节点的 key 的数组 2. boolean 类型的参数，若为 true 则仅设置叶子节点的选中状态，默认值为 false
node-key ：每个树节点用来作为唯一标识的属性，整棵树应该是唯一的