I'm currently working on passing a parameter to the @select event function in Vue.js
HTML
<template>
<div class="container">
<div v-for="(billItem, k) in billItems" :key="k" >
<div class="form-group row">
<label class="col-form-label col-sm-3" for=""> Products</label>
<div class="col-sm-3">
<div class="form-group">
<label for="">Product</label>
<multiselect
v-model="billItem.billItem_selectedGood"
:options="productOptions"
:close-on-select="true"
:clear-on-select="false"
:hide-selected="true"
:preserve-search="true"
placeholder="Select Product"
label="name"
track-by="name"
:preselect-first="false"
id="example"
@select="onSelect_selectedGood(billItem)"
>
</multiselect>
</div>
</div>
</div>
</div>
</template>
JS
<script>
export default {
data(){
return {
form: new Form({
})
}
},
methods : {
onSelect_selectedGood( billItem, option, id) {
console.log("onSelect_selectedGood");
console.log(option);
console.log(billItem); // Accessing billItem inside the function
}
},
mounted() {
}
}
</script>
My Question: I want to know how to pass billItem to onSelect_selectedGood so that it can be accessed inside the function.
To implement this, I tried using
@select="onSelect_selectedGood(billItem)"onSelect_selectedGood( billItem, option, id)