VUE v-model 为什么不是响应式的

Question

创建了一个a,里面有个

companyName

在 created 里 a拷贝到b

然后

b.cName = a.companyName

,在input输入框修改b.cName，但不要改变a.companyName，

为什么页面上的{{b.cName}} 的结果没有变化

a.companyName:{{a.companyName}}==
 b.cName:{{b.cName}}
 <el-input v-model="b.cName"></el-input>

data() {
  return {
    a:{
      companyName:''
    },
    b:{

    }
   }
 }

 created() {
      this.a.companyName = '太平洋咖啡';
      this.b =  Object.assign({}, this.a);
      this.b.cName = this.a.companyName;
    }

Answer 1

data() {
  return {
    a:{
      companyName:''
    },
    b:{
      cName: ''
    }
   }
 }

created() {
  this.a.companyName = '太平洋咖啡';
  this.b = Object.assign({}, this.b, this.a);
  this.b.cName = this.a.companyName;
}

Answer 2

data() {
 return {
   a:{
     companyName:''
   },
   b:{
     cName: ''
   }
  }
},


created() {
 this.a.companyName = '太平洋咖啡';
 this.b =JSON.parse(JSON.stringify(this.a));
 this.$set(this.b, 'cName', this.a.companyName)
}