避免在嵌套数组上进行数据绑定 - vue.js

Question

我头痛避免在嵌套数组上进行数据绑定。 让我们说我有两个对象：

• 项目，所有项目的数组
• 项目，单个项目对象

我用

Object.assign({}, object) 

为了避免数据绑定，这只适用于非嵌套数组字段。 例如：

data: {
    items: [
        {
        name: 'Pencil case',
        contents: [
            {title: "Red Pencil"}, {title: "Blue Pencil"}
            ]
        }, 
      {
        name: 'Rubber container',
        contents: [
            {title: "Yellow Rubber"}, {title: "Green Rubber"}
            ]
        },
    ],

    selected_item: {
      name: 'Pencil case',
      contents: [
        {title: "Red Pencil"}, {title: "Blue Pencil"}
      ]
    }
},
mounted() {
  this.selected_item = Object.assign({}, this.items[0]);
}

名称上没有数据绑定，但仍然在contents.title上有绑定。我绝对需要在没有数据绑定的情况下完全分配对象。

这里是JSFIDDLE。 在第一个输入绑定＆＃34;标题＆＃34;是真实的，而在第二个输入中没有约束＆＃34; name＆＃34;正如所料。我无法克服它，请帮助我。