[Vuejs]-V-model not updating data when using a v-for in Vue

2👍

Hey I’ve got your problem.

Its just a very simple issue.

<my-component 
    :showname="element.showname" 
    :type="element.type" 
    :name="element.name" 
    :count="vm.count" v-for="element in elements">
</my-component>

So in your component add sync to enable two way binding.

<my-component 
    :showname.sync="element.showname" 
    :type="element.type" 
    :name="element.name" 
    :count="vm.count" v-for="element in elements">
</my-component>

Here you can see I’ve added showname.sync which enables two way binding.

By Default when parents property updates, it flows down to its children but not in reverse. you’ll have to add sync or once binding type modifiers.

Here’s the link
https://vuejs.org/guide/components.html#Prop-Binding-Types

Here’s the jsBin http://jsbin.com/mitojijaya/1/edit?html,js,output

Hope this helps.

Leave a comment