Question

我正在使用laravel / vue.js处理我的项目，我决定使用简单的vue-multiselect从我的数据库中选择类别。我想清除输入字段的值（查找列表中的项目）。

我的多选组件：

<multiselect 
    v-model="value" 
    placeholder="Find the category" 
    label="category_name"
    :options="categories"
    @input="addReceiversFromCategory">
</multiselect>

我尝试清除v模型，但它仅适用于页面加载后的第一个选择（并且它不是一种智能方式......）。我尝试的最后一件事是:clear-on-select="true"，但是当多个为真时它会起作用（我不想这是真的）。我认为这很简单，但我在文档doc

中找不到任何方法

Answer 1

如果您的v-model只是对所选值进行建模，那么您需要使用该值，然后将value重置为null。我真的不知道你的组件是如何设置的，但它看起来像这样：

<template>
  <select v-model="value" v-on:change="doSomething()">
    <option :value="null">-- Select --</option>
    <option value="foo">Foo</option>
    <option value="bar">Bar</option>
  </select>
</template>

<script>
  module.exports = {
    data: function(){
      return {
        value: null
      };
    },
    methods: {
      doSomething: function() {
        if( this.value ) {
          var data = this.value; // now you can work with data
          this.value = null; // reset the select to null
        }
      }
    }
  }
</script>

vue.js：vue-multiselect，选中后清除输入值

1 个答案: