element tree选父节点所有子节点选中，选子节点父节点选中

<template>
  <div class="cm">
    <el-row v-loading="loading">
      <el-col :span="24" :xs="24" style="height: 550px;overflow-y: auto;">
       <el-tree ref="tree" :data="data" :props="props" show-checkbox node-key="menuId" :check-strictly="true"
          :default-checked-keys="array" @check="clickDeal">
        </el-tree>
      </el-col>
      <el-col :offset="4" :span="6" class="mt20">
        <el-button @click="getCheckedKeys" size="mini" type="primary">提交</el-button>
      </el-col>
    </el-row>
  </div>
</template>

<script>
  import {roleMenu,roleMenuUpdate} from "@/api/system.js";
  export default {
    props: ["permissionRoleId"],
    components: {},
    watch: {},
    data() {
      return {
        loading: false,
        data: [],
        props: {
          label: "name",
          children: "children",
        },
        checkedId:[],
        count: 1,
        array:[]
      };
    },
    created() {
      this.initMe();
    },
    updated () {
     // 给多选树设置默认值
      this.$refs.tree.setCheckedKeys(this.array)
    },
    methods: {
      clickDeal(currentObj, treeStatus) {
        // 用于：父子节点严格互不关联时，父节点勾选变化时通知子节点同步变化，实现单向关联。
        let selected = treeStatus.checkedKeys.indexOf(currentObj.menuId) // -1未选中
        // 选中
        if (selected !== -1) {
          if(currentObj.children && currentObj.children.length!=0){
            // 子节点只要被选中父节点就被选中
            this.selectedParent(currentObj)
            // 统一处理子节点为相同的勾选状态
            this.uniteChildSame(currentObj, true)
          }
        } else {
          // 未选中 处理子节点全部未选中
          if (currentObj.children && currentObj.children.length !== 0) {
            this.uniteChildSame(currentObj, false)
          }
        }
      },
      // 统一处理子节点为相同的勾选状态
      uniteChildSame(treeList, isSelected) {
        this.$refs.tree.setChecked(treeList.menuId, isSelected);
        if (treeList.children && treeList.children.length!=0) {
          for (let i = 0; i < treeList.children.length; i++) {
            this.uniteChildSame(treeList.children[i], isSelected)
          }
        }
      },
      // 统一处理父节点为选中
      selectedParent(currentObj) {
        let currentNode = this.$refs.tree.getNode(currentObj)
        if (currentNode.parent.key !== undefined) {
          this.$refs.tree.setChecked(currentNode.parent, true)
          this.selectedParent(currentNode.parent)
        }
      },
      handleCheckChange(data, checked, indeterminate) {
      },
      handleNodeClick(data) {
      },
      //获取树形的数据
      initMe() {
        var that = this;
        var data = {
          roleId: this.permissionRoleId,
        };
        this.loading = true;
        roleMenu(data).then((res) => {
          if(res.code == 200){
              this.loading = false;
              that.data = res.data.sysMenusList;
              var tempdata = res.data.sysMenusList;
              var array = [];
              function deep(val) {
                if (!val.children) {
                  if (val.checked == "true") {
                    array.push(val.menuId);
                  }
                } else {
                  for (var i = 0; i < val.children.length; i++) {
                    if (val.checked == "true") {
                      array.push(val.menuId);
                    }
                    deep(val.children[i]);
                  }
                }
              }
              for (var k = 0; k < tempdata.length; k++) {
                var tempDeep = deep(tempdata[k]);
              }
              this.array = array;
           }else{
          	this.$message({
             	type:"error",
             	message:res.message
           	})
           }
        });
      },
       //保存提交
      getCheckedKeys() {
        var data = {
          menu: this.$refs.tree.getCheckedKeys(),
          roleId: this.permissionRoleId
        }
        console.log('提交数据',data)
      },
    },
  };
</script>

选父节点所有子节点选中

选子节点父节点选中