To get selected option on @change with Vue.js, we should use v-model to bind the selected value to a reactive property.
For instance, we write
<select
name="LeaveType"
@change="onChange($event)"
class="form-control"
v-model="key"
>
<option value="1">Annual Leave/ Off-Day</option>
<option value="2">On Demand Leave</option>
</select>
<script>
const vm = new Vue({
data: {
key: ""
},
methods: {
onChange(event) {
console.log(event.target.value)
}
}
}
</script> to add a select drop down.
We bind the key reactive property to the value of the selected value of the drop down with v-model.
Also we can get the value from event.target.value from the change event handler.