使用React Hooks怎么实现getDerivedStateFromProps

通常应当尽量避免使用getDerivedStateFromProps。尽量使用受控组件，减少渲染次数，同时也可以是数据流更加清晰。如果不得不根据属性来改变内部状态，那么使用hook怎么来实现对应的功能呢？
官方给出了如下代码，在状态中保存先前属性，紧接着比对先前属性和当前属性。如果不一样就更新状态，实现属性和状态的同步。

function ScrollView({row}) {
  const [isScrollingDown, setIsScrollingDown] = useState(false);
  const [prevRow, setPrevRow] = useState(null);

  if (row !== prevRow) {
    // Row changed since last render. Update isScrollingDown.
    setIsScrollingDown(prevRow !== null && row > prevRow);
    setPrevRow(row);
  }

  return `Scrolling down: ${isScrollingDown}`;
}

看着很奇怪，居然在渲染过程中更新状态。不过官方说明了getDerivedStateFromProps本身设计便如此。在设置完新的状态后，react不会继续当前的渲染过程，而是会重新调度一次渲染，所以开销并不是很昂贵。

欢迎访问作者的github项目：
一个支持多店铺的电商系统，基于Spring Boot的微服务构架
https://github.com/ikeyit/ikeyit-services
一个基于React的电商管理后台
https://github.com/ikeyit/ikeyit-management-web