为什么组件通过 v-model 绑定到 Array 后无法更新？

Question

Array1 Array 区域都通过 v-model 绑定到同一个数组变量。但是当 Array1 更新时，Array2 没有更新！所以为什么？

执行：

如您在日志中所见，ArrayInput#1 已发出 input 事件。但是，ArrayInput#2 的 updated 方法没有被调用。那为什么？

源代码在这里：http://jsfiddle.net/h313j5sh/3/

Answer 1

你需要在传递的道具上使用watcher：value如下：

watch:{
  value: function(val){
     this.text = val.join(',')
  }
}

并且还在组件中使用 v-model:

template: '<input type="text" @input="onInputText" placeholder="Enter comma separated array" v-model="text" />',

查看工作演示：http://jsfiddle.net/h313j5sh/7/

Updated 块不起作用，因为它的范围仅限于它自己的组件，它不会影响其他组件的 DOM。