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 的推断是如何错误的。