elementui tree的key值一定是唯一的么?一个子节点存在多个父节点这种情况,怎么处理比较复杂的交互问题?

芄子酱
  • 507

一个子节点存在多个父节点这种情况怎么处理?
李四都是同一个id值
取消教科研部门的李四,教学处的李四没有取消。要不我选择教学处李四,教科研不选中。怎么捣鼓都不行,用这个法子this.$refs.depTree.setCheckedKeys(选中的key)不行,我就先给this.$refs.depTree.setCheckedKeys([]),发现选中项不会完全清空,就用另个法子

travelNodes(tmpRoot) {
      tmpRoot.checked = false
      // 叶子节点
      if (tmpRoot.childNodes.length === 0) {
        return
      }
      // 不是叶子节点,递归遍历
      else {
        let tmpChildNoes = tmpRoot.childNodes
        for (let i = 0; i < tmpChildNoes.length; i++) {
          this.travelNodes(tmpChildNoes[i])
        }
      }
    }

操作dom元素来清空,然后this.$refs.depTree.setCheckedKeys(选中的key)还是不行,现在脑子都已经是浆糊了,已经乱成一团了
image.png

回复
阅读 194
2 个回答
✓ 已被采纳

key肯定是唯一的,这种情况可以将子节点的key设置为 'parentKey-childKey' 这样的形式。

然后按照上面的形式处理数据就行,比如初始的人物数组为 {教学处: ['李四','张三'], 教科研: ['李四']} 循环处理一下,变成 {教学处: [{key: '教学处-李四', value: '李四'},{key: '教学处-张三', value: '张三'}], 教科研: [{key: '教科研-李四', value: '李四'}]}

理论上,key 值肯定是唯一的,如果出现重复子叶节点的话,可以选择 {P_ID}-{C_ID} 的形式。
这个时候选就可以选择单个叶子节点并且不会提示ID重复的错误了。

然后如果想同步选择所有重复的叶子节点,请把所有子叶节点存放在一个集合中,然后根据子叶节点的ID去查找所有匹配节点。
或者找到当前选择的节点,根据parentsIds生成所有相似节点,之后修改已选ids数组。
如果可以提供 Tree 数据的话,就更好了,可以贴出demo示例答案供参考。


已参与了 SegmentFault 思否「问答」打卡,欢迎正在阅读的你也加入。
你知道吗?

宣传栏