Menu
I would like to populate my select tag with options from an array variable which contains arrays of number values. But the values that are reproduced seems to be blank
HTML:
<select required id="dropDown">
<option>Select here</option>
<option v-for="choice in choices">{{ choice }}</option>
</select>
Javascript:
var vm = new Vue({
el: 'body',
data:{
'choices': [1,2,3,4,5]
}
});
Can someone point me of my mistake? Because I am just a beginner though, and I would like to learn from you guys.
585
The el option should provide Vue with an existing DOM element to mount on. You have provided a CSS selector for body, so Vue will try to mount on the body element.
Otherwise your code is correct. Just wrap your HTML in body tags and it works!
var vm = new Vue({
el: 'body',
data:{
'choices': [1,2,3,4,5]
}
});<!-- Load Vue JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.26/vue.js"></script>
<!-- add body tags so `el: 'body'` resolves to an HTML element -->
<body>
<select required id="dropDown">
<option>Select here</option>
<option v-for="choice in choices">{{ choice }}</option>
</select>
</body>If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
