Vue中v-model无法动态更新对象数组数据

Question

由于需要从服务端请求对象数组，数据格式类似[{name:'xiaoming'},{name:'xiaohong'}]，然后在本地进行修改，并上传修改的部分。
我的思路如下：

1. data中有两个数组变量：list和listChange，分别表示从服务端请求来的数据，和用户修改的数据；
2. listChange通过克隆list得到；
3. input输入框中v-model对应listChange中每个对象（如{name:'xiaoming'}）的name属性

代码大致如下（部分是伪代码）

<template>
  <div class="set-catalog">
    {{list[0].name}}--{{listChange[0].name}}
    <section class="row" v-for="item in listChange">
        <input type="text" v-model="item.name"/>
    </section>
  </div>
</template>
<script type="text/ecmascript-6">
    export default{
        data(){
          return {
            list: [],          //用来存放从后端请求来的数据
            listChange: [],    //用来存放用户修改的数据
          }
    },
    methods：{
        clone(target) {
          if (typeof target !== 'object' || target === null) {
            return target
          }
          if (target instanceof Array) {
            let newArr = [];
            for (let i = 0; i < target.length; i++) {
              newArr.push(clone(target[i]));
            }
            return newArr;
          }
          let newObj = new Object();
          for (var i in target) {
            newObj[i] = clone(target[i]);
          }        
          return newObj;
    }，
    created(){
      this.list=从服务端请求来的数据；
      for (let i = 0; i < this.list.length; i++) {
//            this.listChange[i]=this.list[i];
//            this.listChange.push(this.list[i]);
//            以上两种方法都可以实现同步更新，但是由于是对象导致list和listChange皆会改变
            let newObj=this.clone(this.list[i]);
            this.listChange.push(newObj);
//            如果使用this.listChange[i]=newObj无法在input中的v-model实现同步更新，不知原因
          }
    }
  }
</script>

由于一开始自己clone对象数组是采用如下代码的方式，即

this.listChange[i]=this.list[i];
this.listChange.push(this.list[i]);

结果导致在input输入框中更改数据时，导致list和listChange的数据同时更改
后来采取了如上代码中的clone函数，但是问题来了（抱歉有这么长的铺垫），
如果采用push方法，在input输入框中更改数据时能够同步刷新。

let newObj=this.clone(this.list[i]);
this.listChange.push(newObj);

但是为什么使用this.listChange[i]=newObj无法在input中的v-model实现同步更新。
如果是this.listChange[i]=newObj无法实现同步更新，那为什么this.listChange[i]=this.list[i];
this.listChange.push(this.list[i])又可以同步更新

Answer 1

this.listChange[i]=newObj操作的是 this.listChange[i]
而this.listChange.push(newObj);操作的是this.listChange
vue监听的是this.listChange没有监听this.listChange的子项所以直接改变子项不会触发更新