React-在ShouldComponentUpdate中捕获中间体

Question

在我shouldComponentUpdate实现中，我需要做一个简单的计算。 我还需要做与render实现相同的计算。 我希望能够在shouldComponentUpdate捕获计算结果，并在render实现中重用它-即，我希望避免两次计算相同的值。

有没有推荐的方法来实现这一目标？

Answer 1

最好的方法可能是在组件内部定义自己的setState()包装器，例如：

setMyState(newProps, newState) {
  var nonTrivialResult = doStuff(newProps, newState);
  newState.checkSum = nonTrivialResult;
  this.setState(newState);
}

并在可以调用setState()任何地方以及从componentWillReceiveProps调用此新方法。

包装者可以访问所有当前的道具和状态以及您传入的任何新道具和状态。这样，您应该可以进行所需的任何计算。

此外，您可能需要在第一轮中从getInitialState()调用doStuff() 。

在此设置中，每个渲染只进行一次计算。 您可以在shouldComponentUpdate()检查结果。

在反应生命周期中， shouldComponentUpdate()在componentWillReceiveProps()之后调用shouldComponentUpdate() componentWillReceiveProps() ，所以这应该可以工作。

Answer 2

您可以在componentWillReceiveProps处处理它，并用计算结果在那里更新状态吗？ （对不起，这应该更像是评论，但我没有足够的代表）