当前位置:首页 > 经验笔记 > VUE > 正文内容

element-ui Tree 树形控件实现单选 最简方法VUE

han32686年前 (2020-07-30)VUE14344

做项目时需要用到Tree树形控件单选但是Tree组件没有单选设置,网上找了几个方法不太适应,看了官网文档发现很简单 代码如下

          <el-tree
            ref="treeForm"
            default-expand-all
            node-key="id"
            :data="findCapitalAreasData"
            :props="defaultProps"
            show-checkbox
            :check-strictly="true"
            @check="handleCheckChangeArea"
          ></el-tree>
    //当复选框被点击的时候触发
    handleCheckChangeArea(data) {
      var labvalojb = data; //暂存选中节点
      // console.log(data);
      this.$refs.treeForm.setCheckedKeys([]); //删除所有选中节点
      this.$refs.treeForm.setCheckedNodes([labvalojb]); //选中已选中节点
    },







扫描二维码推送至手机访问。

版权声明:本文由瀚文博客发布,如需转载请注明出处。

本文链接:https://hanwenblog.com/post/20.html

分享给朋友:

相关文章

vue引入本地json数据文件

    data() {         return {...

vue element table expand 设置只可以展开一行、设置点击行即可打开扩展内容

在Vue中使用Element UI的el-table组件时,‌可以通过以下步骤设置只可以展开一行以及通过点击行即可打开扩展内容:‌设置只可以展开一行:‌通过监听expand-change事件来实现每次...

vue 去除前后空格trim的使用方法

一、使用trim修饰符<input v-model.trim = "massage" >二、使用filter过去属性 <...

在vue中实现element-ui的el-dialog弹框拖拽

1.在assets/js/文件夹下新建directives.js 文件:import Vue from 'vue' // v-dialog...

elementUI Cascader组件在for循环中无法使用getCheckedNodes这个方法

elementUI Cascader组件在for循环中无法使用getCheckedNodes这个方法

上一篇文章说了elementUI组件获取label的值,把Cascader选择器放在for循环中问题又来了用getCheckedNodes报错没有这个方法我就试探性的看看他的上级有没有存储 ...