Vue模型：绑定嵌套数据

Question

如何将以下嵌套数据与v-model绑定？

<div v-for="(frame, i) in frames" :key="frame.id" class='well'>
  <div v-for="(value, key) in frame" :key="key">
    {{ key }}:
    <input type="text" :v-model="frame[i].key" :id="key.id">
  </div>
</div>

将这类数据存储在this.frames中：

[{"x": 0, "y" : 0, "width": 10, "height": 10, "direction": "down", "div": "header", "page_number": 1}]

显然，列表中可以有很多对象。

Answer 1

对于任何在家玩耍的人：

<input type="text" v-model="frames[i][key]" :id="key.id" class="form-control">

请注意这里的无冒号（:v-model="frame[i].key"）尽管动态键名，并请注意@Stephen Thomas的注释，它解释了colon = dynamic是错误的推断。