将componentDidUpdate（prevProps）重写成一个钩子

Posted 2021-04-04

我想把这个生命周期的metod重写成一个钩子：

componentDidUpdate(prevProps) {
  if (this.props.lng !== prevProps.lng && this.props.lat !== prevProps.lat) {
    this.map.setView(new L.LatLng(this.props.lat, this.props.lng), 6);
  } else if (this.props.mapTheme !== prevProps.mapTheme) {
    this.setMapTheme(this.props.mapTheme);
  }
}

我知道使用useEffect钩子但找不到一个好的例子。

答案

useEffect(() => {
  this.map.setView(new L.LatLng(this.props.lat, this.props.lng), 6);
}, [this.props.lng, this.props.lat]);

useEffect(() => {
  this.setMapTheme(this.props.mapTheme);
}, [this.props.mapTheme]);