I am using vue-multiselect component in my vue.js project, I am using v-on directive to execute a function on the change event ,
<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>
I have example full code here: https://codesandbox.io/s/yjjon0vzxj
the v-on:change
was working with <select>
component but it stopped workigng with vue-multiselect ! I tried with v-on:click="executeLoader"
but that too didnt worked either..
@click
will not trigger the method executeLoader
with vue multiselect. You can use @input
- which is similar to v-on:change
, @close
, @select
as in example below:
<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>
In your case I would try @input="executeLoader"