前端-树形控件

1.如下图。显示出默认显示节点。然后进行多选添加，多选删除

实现思路：
1》后端返回勾选的列表，以及全部数据。
2》前端将，数组的数据-》树形数据

//伪代码
array-》map<key,Object>
let result=[]
array.forEach((ele)=>{
	let parent = map[ele.upId]//获取第一个节点的父节点。
	if(parent){
		//存在上级节点,把子节点和父节点连接上
		（parent.children || (parent.children)=[]）.push(ele)
	}else{
		result.push(ele)//不存在就是根节点。直接加入
	}
})

3》设置默认选中的节点defaultCheckedKeys

defaultCheckedKeys.length=0
defaultCheckedKeys=取到默认选中的数组数据
nextTick(()=>{
	treeRef.value.setCheckedKeys(defaultCheckedKeys)
	//vue3写法
})

4》修改勾选之后获取变化的节点。

let updateKeys = treeRef.value.getCheckedKeys()
//再将新的updateKeys与defaultCheckedKeys对比
过滤出新增的节点，删除的节点。