selected in vue js code example
Example 1: how to select specific option in vue
<select>
<option v-for="(item , index) in categories" v-bind:key="index" :selected= "item.id == 30" >
{{item.title}}
</option>
</select>
Example 2: how manipulate the multiple input option data in one function in vue js
<template>
<select
:class="$options.name"
v-model="selected"
@change="updateValue"
>
<option
disabled
value=""
v-text="disabledOption"
/>
<option
v-for="option in options"
:key="option"
:value="option"
v-text="option"
/>
</select>
</template>
<script>
export default {
name: 'FormSelect',
model: {
event: 'change',
},
props: {
disabledOption: {
type: String,
default: 'Select something',
},
options: {
type: Array,
default: () => [],
},
value: {
type: [String, Number],
default: null,
},
},
data() {
return {
selected: this.value,
};
},
methods: {
updateValue() {
this.$emit('change', this.selected);
},
},
};
</script>