javascript - Material 表 TypeError : Cannot add property tableData, 对象不可扩展

Question

我正在使用 meterial-table 和 React。我正在尝试从来自这样的 api 的数组中分配数据

<MaterialTable
  columns={columns}
  data={rows}
  ...
/>

其中列和行是api数据。但是我收到了这个错误:

TypeError: Cannot add property tableData, object is not extensible

值得注意的是，当我使用模拟硬编码数据时，一切正常。经过一番搜索，我找不到任何解决方案，有帮助吗？

Answer 1

您很可能正在使用 immer 或在后台使用 immer 的库(例如 @reduxjs/toolkit)。 immer 使用 Object.freeze 使其生成的对象不可变。

material-table 修改自己的 Prop (这是一个非常丑陋的反模式)。当图书馆违反规则时，他们将不会与试图强制执行规则的图书馆合作。

无法解冻已卡住的对象，但您有两种选择:

1. 找到一种在 immer 实例中禁用卡住的方法(查看 API 文档，了解您认为可能卡住状态的任何内容)。

2. 覆盖 Object.freeze 使其什么也不做(非常 hacky，应该避免 - 但它可能是你最好的选择):

window.Object.freeze = function(obj) { return obj }

1. 在将状态传递给 MaterialTable 之前克隆/深度复制您的状态。这也远非理想，尤其是当您有大量数据时。