vue.js - v-on :change does not work for vue-multiselect

Question

我在我的 vue.js 项目中使用 vue-multiselect 组件，我使用 v-on 指令在更改事件上执行函数，

<multiselect v-model="selected" :options="projects" :searchable="false" :custom-label="customLabel" track-by="name" v-on:change="executeLoader">
<template slot="customLabel" slot-scope="{ customLabel }"><strong>{{ option.name }}</strong></template>   
</multiselect>

我这里有示例完整代码:https://codesandbox.io/s/yjjon0vzxj

v-on:change正在与 <select> 合作组件，但它停止使用 vue-multiselect!我试过 v-on:click="executeLoader"但这也没有用..

Answer 1

@click 使用vue multiselect 不会触发方法executeLoader。您可以使用 @input - 这类似于 v-on:change、@close、@select 作为在下面的例子中:

<multiselect placeholder="Pick at least one" select-label="Enter doesn’t work here!" :value="value" :options="options" :multiple="true" :searchable="true" :allow-empty="false" :hide-selected="true" :max-height="150" :max="3" :disabled="isDisabled" :block-keys="['Tab', 'Enter']" @input="onChange" @close="onTouch" @select="onSelect"></multiselect>

在你的情况下，我会尝试 @input="executeLoader"