Question

我遇到类似问题

无法添加属性X，对象不可扩展

在用Ngrx更新我的角度项目到角度9之后。当我将Ngrxversion回滚到8时，它工作正常。但是我需要使用角度9更新将其更新到v9。当我将其添加为具有附加属性的材料表中的datasource.data时，就会发生这种情况。我认为附加属性更改是这样做的原因。但是我根据所得到的内容创建了一个新的数组，并通过使用slice进行了如下尝试。

 myDataArray.slice(0)

它也不起作用。

我在此处https://ngrx.io/guide/migration/v9引用了Ngrx版本8到9的更改列表和迁移指南。

我发现有一个与角度9不变性相关的特殊变化。他们在那里定义了与操作，状态和可序列化相关的不变性逻辑。我在https://ngrx.io/guide/store/configuration/runtime-checks

上尝试了他们建议使用Ngrx V9更新解决这些问题的方法

但是这些都不适合我。如果有人可以解决此问题，这真的很有帮助。预先感谢。.

错误堆栈跟踪..（我也使用了matDataFlatner，这也是发生对象突变的地方）

app-error-handler.ts：30 TypeError：无法添加属性级别，对象不可扩展在MatTreeFlattener.defaultFlattenerTransform [作为transformFunction]（tree-table-flattener-builder.ts：57）在MatTreeFlattener._flattenNode（flat-data-source.ts：58）在flat-data-source.ts：81 在Array.forEach（）在MatTreeFlattener._flattenChildren（flat-data-source.ts：78）在MatTreeFlattener._flattenNode（flat-data-source.ts：65）在flat-data-source.ts：92 在Array.forEach（）在MatTreeFlattener.flattenNodes（flat-data-source.ts：92）在MatTreeFlatDataSource.set（flat-data-source.ts：138）

Answer 1

您应该深克隆myDataArray，因为它是通过选择器从商店中出来的。在存储中保持数据的不变性是redux模式的重要部分，如果您修改myDataArray（取决于选择器，它可能是相同的数据=>，则直接在存储中更改数据）对商店中数组的引用）。

您可以先进行myDataArray = JSON.parse(JSON.stringify(myDataArray))的更改，然后再进行更改。

有更有效的方法来深克隆对象，例如使用fast-copy：

import copy from 'fast-copy';

...

myDataArray = copy(myDataArray);

Answer 2

您可以使用lodash库中的cloneDeep函数深度克隆对象并避免错误：

import {cloneDeep} from 'lodash';

const clonedData = cloneDeep(myDataArray);

然后，您可以添加属性或所有要克隆的对象。

致谢！

Answer 3

我在这里参考了 Ngrx 版本 8 到 9 的更改列表和迁移指南

https://ngrx.io/guide/migration/v9

我发现有一个与 angular 9 的不变性相关的特殊变化。他们在那里定义了动作、状态和可序列化相关的不变性逻辑。我在这里尝试了他们建议的解决 Ngrx V9 更新问题的方法

https://ngrx.io/guide/store/configuration/runtime-checks

您可以进行以下更改，


@NgModule({
  imports: [
  StoreModule.forRoot(reducers, {
    runtimeChecks: {
      strictStateImmutability: false,
      strictActionImmutability: false,
    },
  }),
 ],
})
export class AppModule {}

@ngrx/store ships with five (5) built-in runtime checks. Try disabled all checks

无法添加属性X，更新ngrx 9后对象无法扩展

3 个答案: