9102 了， React 更新 state 数组的最优解是什么？

[dobelee]

state.array 是个庞大的数组。需要更新某个索引的内容。 首先

state.array[999]['field'] = true;

有 react/no-direct-mutation-state 警告，但实际是可行的。

google 众说纷纭，不引入其他库时，被推荐最多的是类似如下模式：

let array = state.array;
array[999]['field'] = true;
this.setState({ array })

这种很显然有性能问题，数据太多卡如🐶。

[s609926202]

同，想知道正确的操作。

[hua123s]

同，想知道怎么操作

[lijsh]

你这嵌套过多了，先将数据 normalize 再放进 state

[seki]

？？？
这当然是不可行的

state.array 是一个引用，你修改 array 变量和直接修改 state.array 没有任何区别，甚至 array[999] 也不会因为你 setState 而更新

数据太多卡住了应该先去去分析瓶颈，而不是用反模式的代码来引入潜在的 bug

[fuermosi777]

immutable library?

[Mikewu]

https://immerjs.github.io/immer/docs/introduction
可以考虑一下 immer.js ，我认为是接入成本最小的 immutable data 方案了

[wangxiaoaer]

@lijsh #3

```
state:{
array:[
{field:true},
....
]
}
```

这个结构不算嵌套很多吧。

[lijsh]

@wangxiaoaer #7 那直接整个 array 覆盖感觉也行啊，只要绑定好 key，只有修改的 item 才会重新 render

[wangxiaoaer]

@lijsh #8 reactjs 不太熟悉，我只是直觉认为他这个结构还是比较常用的，不算嵌套太多。

[muzuiget]

那个警告是对的，你搜到那个代码是错的，之所以有效是因为每次调用 this.setState() 都会强制重 render 了。

不见得卡使用个更新数据姿势问题，你应该优化 render 里的数据量，比如延迟加载，先跳过看不见的条目。

[newbieRenew]

immerjs 来处理吧，我目前用的是 immutable-helper，数据量小，没遇到瓶颈问题。下个项目试试 immer

[maomaomao001]

mobx

[Hanggi]

原来 React 整天在研究这种问题。