javascript - React componentDidUpdate：检查状态或道具更改是否导致更新？

Question

我有一个列表组件，其中包含许多来自 Redux 商店的道具的条目。条目被转换和过滤并放入 中的状态componentDidUpdate。但是，当组件的内部状态发生变化时，也会调用此函数。

所以我现在正在检查每个状态变化，如果来自道具的条目发生了变化。这对我来说似乎非常不必要，因为有时只有一个条目不同，整个列表需要与前一个进行比较。

我怎么能有类似componentDidUpdate道具的东西？

我想过使用getDerivedStateFromProps()，但它说

此方法适用于状态取决于道具随时间变化的罕见用例。

这不适合我的用例吗？我只是不认为这是一个罕见的。

然后他们给出了使用记忆化来解决这类问题的建议。但是，据我所知，记忆框架仍然必须检查道具是否存在差异。

标签： javascriptreactjsreact-reduxmemoization

Answer 1

您可以使用shouldComponentUpdate(nextProps, nextState)来比较道具

使用 shouldComponentUpdate() 让 React 知道组件的输出是否不受当前状态或道具变化的影响。默认行为是在每次状态更改时重新渲染，并且在绝大多数情况下，您应该依赖默认行为。

当接收到新的道具或状态时，应该在渲染之前调用 shouldComponentUpdate()。默认为真。初始渲染或使用 forceUpdate() 时不会调用此方法。