element tree子节点 默认勾选已知id

个人日常记录，方便查阅

      <el-tree
        ref="tree"
        :data="treeData"
        show-checkbox
        accordion
        :props="treeProps"
        node-key="resourceId"
        :default-expanded-keys="defaultCheckedKeys"
        :default-checked-keys="defaultCheckedKeys"
      >
      </el-tree>

data() {
    return {
      // 树结构
      treeData: [],
      // 树结构以什么展示
      showType: 2,
      treeProps: {
        children: "children",
        label: "resourceName",
      },
      defaultCheckedKeys: [], // 默认勾选
    };
  },

methods:{
   // 获取部门权限详细 permissions
    async getPermissions() {
      const { data } = await permissions({ deptId: this.params.deptId });
/**
 * {"data":[{"systemId": 1,
"systemName": "统一后台管理系统",
"systemShortName": "统一后台管理系统","systemResource":[{
"parentId": -1,
"resourceId": 1,
"resourceName": "首页",
"sortNumber": 10,
"systemId": 1,
"systemName": "统一后台管理系统",
"systemShortName": "统一后台管理系统"
},{
"parentId": -1,
"resourceId": 2,
"resourceName": "组织用户管理",
"sortNumber": 20,
"systemId": 1,
"systemName": "统一后台管理系统",
"systemShortName": "统一后台管理系统"
},]}]}
 */

      data.forEach((v) => {
        this.getPermissionId(v, this.defaultCheckedKeys);
      });
    
      this.$nextTick(() => {
        //  this.$refs.tree.setCheckedKeys(this.defaultCheckedKeys);   这里会把所有的都选上 并没有选到 最底层的子集
      	for (const id of this.defaultCheckedKeys.values()) {
          this.$refs.tree.setChecked(id, true); // 选中检查项
        }
      });
    },
	    // 递归获取默认展示的 key
    getPermissionId(node, arr) {
      if (!node.systemResource) {
        return arr.push(node.resourceId);
      }
      node.systemResource.forEach((item) => {
        this.getPermissionId(item, arr);
      });
    },
}