请注意,该功能
componentWillReceiveProps现已 弃用
。引用官方文件:
如果
componentWillReceiveProps仅当属性更改时才用于重新计算某些数据,请改用备忘录助手。
这是指您的内部检查
componentWillReceiveProps避免不必要地多次重新计算相同内容的情况。在链接的博客文章中,它建议将昂贵功能的结果缓存起来,以便可以查找它,而不是重新计算它。可以使用诸如memoize-
one之类的助手来完成。
如果您过去
componentWillReceiveProps在道具更改时“重置”某些状态,请考虑使用键使组件完全受控或完全不受控制。
同样,链接的博客文章对此进行了更详细的描述,但简而言之:
- “完全受控”组件是指没有状态的功能组件(父组件负责处理状态)。
- “完全不受控制”的替代方法是 仅 使用
props
来设置 初始状态 ,然后忽略对道具的所有进一步更改。
在极少数情况下,您可能希望将
getDerivedStateFromProps生命周期作为最后的手段。
该函数接收
(props, state)并返回
render调用前状态的任何更改,使您可以执行所需的操作。
原始答案,适用于旧版本的React
在此生命周期方法被调用的时间点上,
this.props是指先前的一组道具。
要将
foo新道具的单个属性与旧道具的相同属性进行比较
newProps.foo,只需与比较即可
this.props.foo。因此,在您的示例中:
componentWillReceiveProps (newProps) { if( newProps.profileImage !== this.props.profileImage ) }


