React.js / Redux-如果未更改道具，如何更新状态？

Question

如果要更改道具，我想更新本地状态。但是我找不到适合该问题的解决方案。 getDerivedStateFromProps仅给我nextProps和prevState，但我同时需要prevProps和nextProps。请写出任何可能解决此问题的解决方案）

情况：购物车组件（有状态）从道具中获取数据并将其放入this.state.cart中。 Cart组件具有counterHandler方法，只要更改计数器（onIcrease，onDecrease，onChange），该方法就会触发。该处理程序将计算数据并根据事件生成新数据（计算totalPrice并更新商品数量）。然后将新数据放入setState中以更新UI。状态不会改变，因为我这样做：

static getDerivedStateFromProps(nextProps, prevState) {
 if (!_.isEqual(nextProps.cart, prevState.cart)) {
   return { cart: nextProps.cart };

 } else return null;
}

之所以这样做，是因为我想在更改实际数据（来自props的数据）时更新状态。

目标：在不产生任何副作用的情况下更新柜台价格和总价格的值（这些值可以在商店中更新，也可以仅在本地状态下更新）。

这是我的意思：

Answer 1

您可能想使用componentDidUpdate，它在组件上的道具更新时会调用。它接收prevProps和prevState作为参数，并且您可以访问{nextProps”作为this.props。

例如

componentDidUpdate(prevProps, prevState) {
  if (!_.isEqual(this.props.cart, prevState.cart)) {
   this.setState ({ cart: this.props.cart });
 }
}

Answer 2

您可以使用React类的componentWillReceiveProps方法。该方法将在父组件呈现时执行，其子组件将在子组件中执行componentWillReceiveProps方法。在孩子的这种方法中，您可以基于新道具更新状态。

componentWillReceiveProps(nextProps){
   //You can access current props via this.props
   //You can access newProps from argument
   //Change component state after comparing both props
}