In a simple test in Vue.Js, following the documentation example, span never displays the data selected by select.
The select is set by vue, but the variable select
is not mirrored.
<div class="row" id='vue'>
<select v-model="selected">
<option v-for="option in options" v-bind:value="option.value">
@{{ option.text }}
</option>
</select>
<span>Selected: @{{ selected }}</span>
</div>
<script>
new Vue({
el: '#vue',
data: {
selected: 'A',
options: [{
text: 'One',
value: 'A'
},
{
text: 'Two',
value: 'B'
},
{
text: 'Three',
value: 'C'
}
]
}
})
</script>
I'm using @{{
because it's an implementation in Laravel.