Hello Vue developer, in this tutorial we are going to learn how to get value of the selected option in Vue.js.
With the help of @change
event, we can do it easily. Let’s take a look an example:
App.js
<template>
<div id="app">
<span>Category:</span>
<select @change="selectCategory($event)" class="form-control">
<option>--- Select ---</option>
<option value="1">Laravel</option>
<option value="2">Vue</option>
<option value="3">React</option>
<option value="4">Angular</option>
</select>
</div>
</template>
<script>
export default {
name: 'App',
methods: {
selectCategory(event) {
console.log(event.target.value);
}
}
}
</script>
The console output:
