element-ui 之如何获取 tree 选中的节点

饱饱~~

已于 2022-05-07 13:31:23 修改

阅读量7.8k

点赞数 2

CC 4.0 BY-SA版权

分类专栏： element 文章标签： elementui

于 2022-02-23 13:53:11 首次发布

本文链接：https://blog.youkuaiyun.com/m0_58893670/article/details/123048013

element 专栏收录该内容

7 篇文章

订阅专栏

本文介绍如何在Vue的Element UI Tree组件中获取被选中的节点，并保持即使取消选择后的节点ID管理。通过`handleCheckChange`方法收集节点名和ID，同时处理节点状态变化时的相应逻辑。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

需要获取被选中的所有节点：

<el-tree
        ref="tree"
        class="tenant_tree"
        :data="list"
        show-checkbox
        :props="defaultProps"
        default-expand-all
        node-key="tenantId"
        highlight-current
        @check-change="handleCheckChange"
      >
 </el-tree>

handleCheckChange(data, checked) {
      this.tags.push(data.tenantName)
      //获取所有选中的节点id
      this.tenantUserId = this.$refs.tree.getCheckedKeys().concat(this.$refs.tree.getHalfCheckedKeys())
      console.log(this.tenantUserId, '选中的节点')
      this.checked = checked
      // 该节点未选中的时候
      for (var i = 0; i <= this.tags.length; i++) {
        if (this.checked == false) {
          this.tags.splice(this.tags.indexOf(this.i), 1)
        }
      }
 }