本地存储道具(vue2)

Question

如下所示：

Passing data from Props to data in vue.js

我有：

https://codesandbox.io/s/u3mr8

这会给出以下警告：

​

​

(这个想法是为了避免mutating道具)。在直接的复制对象操作中会发生什么副作用？我还是不明白。该函数只是将道具保存到数据中。

拖放失败，并显示以下信息：

​

​

你真的需要一个计算机道具的setter吗？

查看：

Computed property was assigned to but it has no setter - a toggle component

我想出了：

https://codesandbox.io/s/39sgo

这很好，没有警告，没有错误；只是组件不再渲染(无法从prop中获取保存的数据)。

任何想法/建议/帮助/建议都会非常非常棒。

Answer 1

我认为这个错误被抛出了，因为它不允许在getter中设置用于生成计算属性的值。在获得计算结果的同时修改初始值是一个逻辑循环。相反，您可以在首次调用getter时返回正确的值(如果还没有设置本地值)。

  get() {
    if (!this.itemSectionPropsLocal["itemSectionCategory"]) {
      return Object.assign({}, this.itemSectionProps)[
        "itemSectionCategory"
      ];
    }
    return this.itemSectionPropsLocal["itemSectionCategory"];
  },
  set(value) {
    this.itemSectionPropsLocal = value;
  },

此外，在setter中，您应该分配接收到的值，而不是属性。如果您想要在安装后prop值发生变化时更新本地值，则应该使用监视器。

watch: {
  itemSectionProps: {
    deep: true,
    handler(val){
      this.getPropsLocal = Object.assign({}, val["itemSectionCategory"])
    }
  }
}