javascript - VueJS 无法将输入绑定(bind)到 beforeMount Hook 中生成的属性

Question

我正在尝试在 beforeMount Hook 中生成一系列嵌套的对象。我尝试在输入之间强制执行的任何数据绑定(bind)都不起作用。没有错误。

这是我正在做的事情的一个简单版本，它封装了问题。

new Vue({
  el: "#app",
    data () {return {
    multi: {}, 
    ids: ["eaf", "6ef", "3ey"]
  }},
  beforeMount () {
    this.ids.forEach(i=> {
    	this.multi[i] = {
      	name: "",
      }
    })
  }
})

<div id="app">
  
  <div id="group" v-for="(i, index) in ids">
    <p>Group {{i}}</p>
    <p>{{multi[i].name}}</p>
    
    <input type="text" v-model="multi[i].name">
  </div>
</div>

v-model 绑定(bind)不起作用。

Answer 1

Vue 不会检测已经 react 的对象中的新 Prop 。您应该使用 Vue.$set 或预先创建带有所有必要 Prop 的 multi 对象。请参阅Detection caveats