vue父组件传了变量给子组件，改变子组件的对象时，父组件也跟着改变

1.问题场景

首先我在父页面引用了一个子组件，当点击的时候我会传值给子组件

showItem(stepJsonItem: any) {
    var viewDlg = this.$refs.viewItemDlg as ViewTeachPlatformItemDialog;
    viewDlg.showDlg("修改记录", stepJsonItem);
    console.log("viewDlg", viewDlg);
  }

然后在子组件我会去接收这个值

showDlg(title: string, item: any) {
    this.curTitle = title;
    this.isShowDialog = true;
    this.dataObj = item;
  }

那么问题来了，当我在子组件修改这个对象的时候，我父组件的对象也跟着改变了！

此时他们的引用地址是一个, 而地址是存在栈内存中的,咱们的变量是存在堆内存中的, 好比咱们的vue ajax请求一个接口,将其中的一个数据同时赋值到data中的两个变量, 如果修改其中的一个,另一个也会跟着变, 解决方案就是将其引用地址进行修改,

我当然是不希望这样的，那么解决方式就是 this.dataObj = JSON.parse(JSON.stringify(item));

2.vue更新数组不会渲染视图

updateItem(data: any) {
    var tempIndex = data._index;
    this.stepJsonbArr[tempIndex]=data;
  }

因为vue实现双向数据绑定的机制是数据劫持，也就是在所有对象上有个Object.defineProperty()方法，通过监听set，get方法去实现，而数组没有这两个方法，所以就不会更新view；解决方案就是，需要我们主动通知vue；

this.$set(this.stepJsonbArr, tempIndex, data);

this.stepJsonbArr.splice(tempIndex,1,data);