如何*不*在其数据未更改时更新功能组件

Question

所以我有一个反应应用程序，其中根组件是基于类的，并保持如下状态：

this.state = {
    dataA: { //stuff here},
    dataB: { //stuff here}
}

dataA 被传递给子功能组件 A，dataB 被向下传递给子功能组件 B。

但每当我执行this.setState({dataA: { new state A cotnent }}) 时，组件 B 也会在其数据未更改时更新。

由于组件 B 是功能组件，我无法实现 shouldComponentUpdate 方法。那么当只有dataA 发生变化时，有没有办法不渲染组件B？谢谢！

Answer 1

这是不可能的，因为功能组件在收到道具或状态时总是会重新渲染，即使值没有改变。

相反，我建议将子类从函数组件转换为 PureComponent 的子类，它实现了 shouldComponentUpdate 以浅比较道具和状态。请注意，PureComponents 的所有子级也应该是PureComponents，如果这些条件过于严格，您应该在Component 的子类中自己实现shouldComponentUpdate。