I have a working select box that is sending the selected value to a method on the change event but I have a question with this:
Say I want to send the cat_id value at the time of selection as well (so that I could build an object that relates the cat_id and date within the called method) is there a way to send that cat_id, or any other data, along in that select box change event?
var vm =
new Vue({
el: "#app",
props: {
},
data: {
testing_dates:['2021-11-29', '2021-11-30'],
cat_id: [123]
},
methods: {
testChange(event){
console.log(event.target.value);
},
},
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
<li>Category ID: {{ cat_id }}</li>
<li style="list-style: none;">
<select style="width: auto;" @change="testChange($event)">
<option selected disabled>Options</option>
<option v-for="date in testing_dates" :value="date">{{ date }}</option>
</select>
</li>
</div>You can pass another parameter:
@change="testChange($event, cat_id)"
testChange(event, catId){
console.log(event.target.value, catId);
}
Or access it inside the function:
testChange(event){
console.log(event.target.value, this.cat_id);
}