CODEWITHSUNDEEP
vue.jsv-for
Magistern
Magistern

Reputation: 714

Array indices as v-model in Vue template

I am looping through one array using v-for to show inputs for each item. How can I use another array as the v-model for those inputs? Here's a codepen illustrating my problem. https://codepen.io/jkohlin/pen/XWMMLbe

Upvotes: 0

Views: 106

Answers (1)

Igor Moraru
Igor Moraru

Reputation: 7729

The problem is that the new array items that you create in this.prediction by direct assignment are not reactive. This is why Vue template is not updated with the new values. To make a new property reactive you should use the global Vue.set() or this.$set() instance method.

  mounted() {
    this.dbSavedPredictions.forEach((prediction, i) => {
      this.$set(this.predictions, i, prediction);
    });
  },

You can read more about Vue reactivity and how to avoid such problems here: https://v2.vuejs.org/v2/guide/reactivity.html

Upvotes: 1

Related Questions