el-tree树的反选功能

应用场景：当数据较多时，只想勾选几个不想要的数据，然后使用反选功能。
图例效果：上面的树组件选中了三级，下面的树组件会跟着反选。

环境：vue2 + element-ui 2.15.9

代码

template部分

<el-tree
  :data="datatree"
   :props="defaultProps"
   show-checkbox
   ref="tree"
   node-key="rowGuid"
  @check-change="reversetreeFun"
 >
</el-tree>

<div>上面的树组件选中，下面树组件会相应的反选</div>

<el-tree
  :data="datatree1"
  :props="defaultProps"
  show-checkbox
  ref="inversetree"
  node-key="rowGuid"
>
</el-tree>

data() {
return {
 defaultProps: {
        children: "children",
        label: "title"
      },
      datatree: [
            {
              title: "一级",
              rowGuid: '1',
              children: [
                {
                  title: "二级",
                  rowGuid: '11',
                  children: [
                    {
                      title: "三级",
                      rowGuid: '111'
                    },
                    {
                      title: "三级",
                      rowGuid: '112'
                    }
                  ]
                },
                {
                  title: "二级",
                  rowGuid: '12'
                },
                {
                  title: "二级",
                  rowGuid: '13'
                }
              ]
            }
          ],
      datatree1:[
            {
              title: "一级",
              rowGuid: '1',
              children: [
                {
                  title: "二级",
                  rowGuid: '11',
                  children: [
                    {
                      title: "三级",
                      rowGuid: '111'
                    },
                    {
                      title: "三级",
                      rowGuid: '112'
                    }
                  ]
                },
                {
                  title: "二级",
                  rowGuid: '12'
                },
                {
                  title: "二级",
                  rowGuid: '13'
                }
              ]
            }
          ],
      }
 }


methods: {
	batchSelect(nodes, refs, flag, seleteds) {
		if (typeof nodes != "undefined") {
			nodes.forEach((element) => {
				refs.setChecked(element, flag, true);
			});
		}
	
		if (typeof seleteds != "undefined") {
			seleteds.forEach((node) => {
				refs.setChecked(node, !flag, true);
			});
		}
	},
   reversetreeFun() {
        let reversetree = this.$refs.inversetree;
        this.datatree1 = this.datatree;
        let nodes = this.$refs.tree.getCheckedNodes(true, true)
        this.batchSelect(this.datatree1, reversetree, true, nodes);
        let firstTreeData = this.$refs["tree"].getCheckedKeys();
        // firstTreeData 为第一个树组件选中的数据id集合
        let secondTreeData = this.$refs["inversetree"].getCheckedKeys();
        // secondTreeData 为第二个树组件选中的数据id集合
    },
}