VueJs方法正在直接更改响应

Question

我有一个父级组件，并且我正在向后端进行查询，然后借助导航栏和父级组件中的activeView数据，在Clicks上呈现一个新的子页面并通过响应传递一个prop v-if在vue中的帮助。但是该方法的功能之一是在父组件中更改我的道具，这也改变了我的响应。这是我的子组件的先前安装：

beforeMount() {
    console.log(this.plansPropOrg);
    this.plansProp = this.plansPropOrg;
    this.tempPlan = this.plansProp.currentPlan;

    console.log(this.plansProp);
    this.propsToData();
}

有问题的函数是propsToData，当ı在这里注释掉是正常的，但我必须调用它。

这是我进行查询时的父母：

await axios.post("xxxxx/yyyyyyy").then(res => {
                console.log("heyyo");
                console.log(res);
                this.plansData = res.data.data;
                console.log(this.plansData);
            });

这是数据的道具，它只是将布尔值翻译成英文。但是在响应中（如果为true时）ı会将值视为转换。

propsToData() {
        //TODO: Burdaki if' ifsubscriber olarak değişecel
        console.log("AAA");
        console.log(this.plansProp);
        if (this.plansProp.isSubscriber) {
            console.log("BBBBB");
            this.plansProp.currentPlan.analytics
                ? (this.plansProp.currentPlan.analytics = this.$t(
                      "settings.plans.active"
                  ))
                : (this.plansProp.currentPlan.analytics = this.$t(
                      "settings.plans.inactive"
                  ));
         }
   }

这怎么可能改变响应？

Answer 1

您正在通过引用复制响应和plansProp对象，这意味着两个对象都指向内存中的同一位置。当您更改其中一个时，另一个仍指向内存中的同一位置，这意味着当您检索它时，它将是同一对象。