elment-ui tree单选实现

elment-ui 里面的树形控件,默认是多选的,如果你仔细看过各个属性和方法就可以实现单选。

  1. check-strictly 关闭父子关联
  2. node-key 设置唯一标识
  3. show-checkbox 允许节点可选
  4. ref=“tree”
  5. 添加方法 @check=“treeChange”
<el-tree
              ref="tree"
              :data="menuTreeData"
              node-key="id"
              :check-strictly="true"
              @check="treeChange"
              :props="{
                label: 'title',
                children: 'children'
              }"
              show-checkbox
              accordion
            >
            </el-tree>

check方法:

    treeChange(now, tree) {
        this.$nextTick(() => {
          this.$refs.tree.setCheckedKeys([now.key], true);
        });
    }

获取选中的节点key值:

let kes= this.$refs.tree.getCheckedKeys();
发布了9 篇原创文章 · 获赞 8 · 访问量 371

猜你喜欢

转载自blog.csdn.net/qq_40822000/article/details/104639423