[Vuejs]-Why I only get first object, when the object is in "for loop" and return its value in vuejs?

by

1👍

✅

You can use v-for like this: 

var app = new Vue({
  el: '#app',
  data: {
    myObj: [{
        name: 'Hello',
        age: 10
      },
      {
        name: 'World',
        age: 20
      },
      {
        name: 'Yeah!',
        age: 30
      }
    ]
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.13/vue.min.js"></script>

<div id="app">
  <div v-for="item in myObj">
    <input type="text" v-model=item.name />
  </div>
</div>
👤Milan Chheda

1👍

The simplest solution for what you are trying to do is using v-for and v-model.

<div id="app">
  <input type="text" value="" v-model="item.name" v-for="item in myObj">
</div>

Fiddle

Hope it helps. Please feel free to ask if you to know anything else.

👤Nimeshka Srimal

Leave a comment