在React中如何决定是否使用componentWillReceiveProps或componentWillMount？

Question

在第一次渲染时调用componentWillMount

为后续渲染调用componentWillReceiveProps

那么 - 如果我想在组件被渲染的时候做一些动作（例如在商店中初始化一些数据）我在哪里放这个代码？ - 这取决于从更高级别组件传入的道具。

问题是我不确定在调用第一个渲染时是否会初始化道具。 （道具取决于异步数据）。所以 - 我不能把代码放在componentWillMount中。但是，如果我将它放在componentWillReceiveProps中，然后在组件链中更高的位置进行更改，以便数据同步完成，那么我的代码就不会运行了componentWillReceiveProps。这篇文章的动机是我刚刚做到这一点，现在必须重构一堆组件。

似乎唯一的解决方案是将代码放在两种方法中。

没有生命周期方法总是被称为 - 第一次和随后。但是，您如何确定顶级组件中的数据在第一次渲染时是否一定可用？或者那个问题一定不是。或者也许你可以 - 但是你改变了这一点。

这种生活方式对我来说似乎非常脆弱。我错过了什么吗？ （最有可能的）。

Answer 1

您已经有了答案：将代码放在两种方法中。但是，我建议在两种方法中将道具转换为状态，并使用状态作为你的唯一真相来源。

componentWillMount () {
  this.checkAndUpdateState(this.props);
}

componentWillReceiveProps (nextProps) {
  this.checkAndUpdateState(nextProps);
}

checkAndUpdateState (props) {
  this.setState({ isLoaded: !!props.yourData });
}