Vue-multiselect 插件使用--搜索及单选下拉框

米尔大哥

于 2018-12-14 11:49:09 发布

阅读量9.1k

点赞数 1

分类专栏： Vue.js

本文链接：https://blog.csdn.net/qq_37969201/article/details/85000414

版权

参考官网：https://vue-multiselect.js.org/#sub-select-with-search

1.通过npm安装vue-multiselect

npm install vue-multiselect

2.引用

template中：注意这里的track-by是name，下面准备的数据的key也应该是name

<multiselect class="multiselect" v-model="value" :options="options" placeholder="请输入项目名称"
 label="name" track-by="name"></multiselect>

js中：

<script>
  import Multiselect from 'vue-multiselect'

  export default {
    name: "newproject",
    components: {
      Multiselect,
    },
    data() {
      return {
        value: [],
        options: [
          {name: '项目1'},
          {name: '项目2'},
          {name: '项目3'},