vue配合elementUI开发中...( 值与址的问题?)

在vue结合elementUI开发后台管理系统中，遇到的一个问题，问题的简述：

先看最终的需要的结果

image.png

这是需要的结果

但是，数据是在data里构造的，但是业务需求里并不知道表格的数据，只是知道表格的列的内容，即 data里的contents，

data () {
    return {
      count: '2',
      contents: [
        {
          name: '英语',
          value: '01'
        },
        {
          name: '数学',
          value: '02'
        }
      ],
      form: {
        list: []
          }
        ]
      }
    }
  },

所以要通过data里的 contents 构造表格的数据如下，通过function构造data里的list，list最终是需要提交的

     list: [
          {
            name: '',
            description: '',
            results: [
              {
                id: '01',//第一个检查内容的 id
                state: '1'//将选择的默认状态设置为1 0:不及格，1：及格，2：优秀
              },
              {
                id: '02',//第二个检查内容的 id
                state: '1'
              }
            ]
          },
          {
            name: '',
            description: '',
            results: [
              {
                id: '01',
                state: '1'
              },
              {
                id: '02',
                state: '1'
              }
            ]
          }
        ]

所以，构造代码如下

image.png

最后的结果是第一行d和第二行的列内容，竟然同时改变，

后来打印发现

//list为array,
//list中的results为array
//results 中的每一项为对象类型
console.log(this.form.list[0] === this.form.list[1])//false 
console.log(this.form.list[0].results[0] === this.form.list[1].results[0])//true

这是为什么????

问题已解决

image.png