VueTreeselect 获取当前选中项所有的label值

最新推荐文章于 2024-09-01 11:22:37 发布

zhjjon

最新推荐文章于 2024-09-01 11:22:37 发布

阅读量7.8k

点赞数 2

本文链接：https://blog.csdn.net/xiandaomao5643/article/details/117282882

版权

vue

VueTreeselect 获取当前选中项所有的label值
单选就不用说了看官方文档中的select事件，返回参数中有。

<treeselect
          ref="deptTree"
          :options="option"
          :multiple="multipleType"

          :disable-branch-nodes="branchNodes"
          placeholder="请选择"
          v-model="dept"
          @select="addSelect"
          :appendToBody="false"
          :show-count="true"
          show-overflow-tooltip
        />

单选：

addSelect(value){
        if(!this.multipleType){
          this.selectList = value.label
        }
      },

多选的时候，说一下自己很无脑的一种写法，用获取demo元素，获取的所有值，很不优雅，不喜欢可以直接略过了，给对要求不高的小伙伴们提供一种思路。

if(this.multipleType) {
          this.selectList = "";
          var span = document.getElementsByClassName("vue-treeselect__multi-value-label");
          for (var i = 0; i < span.length; i++) {
            this.selectList = this.selectList + span[i].innerText + ",";
          }
        }

返回的selectList 就是需要的值。需要获取id的话直接绑定v-model就行了