vue树形下拉多选组件vue-treeselect基础使用

​官网使用方法：Vue-Treeselect | Vue-Treeselect 中文网    进阶版请查看：https://www.cnblogs.com/gyw1996/p/15923912.html

//vue页面

 <el-form-item label="岗位">
  <treeselect
    :multiple="multiple"
    v-model="form.postIds"
    :options="postOptions"
    :show-count="true"
    placeholder="请选择岗位"
    :limit="6"
    :limitText="count => `及其它${count}项`"
  />
</el-form-item>

//vue页面方法

import { treeselect } from '@/api/system/dept'
import Treeselect from '@riophae/vue-treeselect'

export default{
 components: { Treeselect },
 data（）{
   return{
    postOptions: [],
    form：{}
 }
}，
created（）{

 post().then((response) => {//这是你从后台调数据的接口方法
    this.postOptions = response.data //这里是后台拿到的整个下拉框数据
 })

getUser(userId).then((response) => {//这里也是调用的后台接口

  this.form = response.data //这是我自己页面要用的数据

  //this.form.postIds就是多选选中的数据

  this.form.postIds = response.postIds //这里是赋值，之前已经选中的数据

 })

  }，

}

 

 

​