Javascript 将代码从函数挂钩转换为类组件

我目前正在尝试将一些钩子转换为React中的类组件内部。我正在尝试重新创建允许会话存储的代码，这样应用程序就不需要从API获取太多内容。代码如下：

useEffect(() => {
        if(sessionStorage.homeState){
            // console.log("Getting from session storage");
            setState(JSON.parse(sessionStorage.homeState));
            setLoading(false);
        }else{
            // console.log("Getting from API");
            fetchMovies(POPULAR_BASE_URL);
        }
    }, [])

    useEffect(() => {
        if(!searchTerm){
            // console.log("Writing to session storage");
            sessionStorage.setItem('homeState', JSON.stringify(state));
        }
    }, [searchTerm, state])

这是两个useEffect钩子，因此对我来说，使用常规组件didmount从会话存储中获取是有意义的。我似乎唯一搞不懂的是如何重新创建第二个useEffect，它设置会话存储并仅在searchTerm或状态更改时激发。searchTerm和state只是状态的两个属性。既然componentDidMount在应用程序首次装载时只触发一次，我如何实现这一点？谢谢

我似乎唯一搞不懂的是如何重新创建第二个useEffect，它设置会话存储并仅在searchTerm或状态更改时激发。searchTerm和state只是状态的两个属性

componentDidMount（）

只是类组件使用的方法之一，您可以使用componentWillUpdate（）或shouldComponentUpdate（）重新创建第二个钩子

例如：

componentWillUpdate(nextProps, nextState) {
  if (this.props.searchTerm !== prevProps.searchTerm) {
    ...
  }
}

您可以通过谷歌搜索“类组件生命周期”来检查类组件中可用的生命周期方法

---

但是，正如您在问题注释中所看到的，钩子可以为您提供的不仅仅是类组件，并且重新创建它们并不是一件小事。从类组件移动到挂钩更容易。

这是您的项目的要求吗？带钩子的功能组件是对类组件的改进，那么您为什么要倒退呢？是的，我知道。我这样做是为了更好地熟悉类和钩子组件的使用方法。一旦我的项目使用类组件完成，我将稍后转换回钩子。