I would like to bind v-model to a specific array element like following, possible?
<input v-model='item[1]' />
Thanks
To add an item to an array in Vue, call the push() method in the array with the item as an argument. The push() method will add the item to the end of the array. Clicking the button adds a new fruit item. The Array push() method adds one or more items to the end of an array and returns the length of the array.
v-bind is a one-way binding. v-model is used for binding form elements like inputs, radio buttons, textarea, checkboxes. It is used for binding data, attributes, expressions, class, styles. V-model is input value sensitive.
It provides two-way data binding by binding the input text element and the value binded to a variable assigned.
The v-bind directive is a Vuejs directive used to bind one or more attributes, or a component prop to an element. If that attribute is binded to our data defined in Vuejs instance then dynamically changes can be observed as data changes.
Yes, that is the right way:
var vm = new Vue({
el: '#vue-instance',
data: {
items: ["Item1", "Item2"]
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.10/vue.min.js"></script>
<div id="vue-instance">
<input v-model='items[0]'/>
<div v-for="item in items">
{{item}}
</div>
</div>
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