Redux重构后，如何在componentDidUpdate中获取前序状态以避免无限循环？

嘿，我来帮你搞定这个问题～

你现在的核心问题是把状态移到Redux后，混淆了componentDidUpdate的参数！因为现在currentPage和searchTerm是存在Redux store里，通过props传递给组件的，而不是组件自身的state，所以你要对比的是前后的props，而不是组件自身的prevState。

componentDidUpdate的第一个参数是prevProps（组件更新前的props），第二个参数才是prevState（组件自身更新前的state，如果你没用到组件自身state的话，这个参数可以忽略）。

修改后的代码应该是这样的：

componentDidUpdate(prevProps) {
  // 获取更新前后的Redux状态
  const { bucketlistState: prevBucketState } = prevProps;
  const { bucketlistState: currentBucketState } = this.props;

  // 对比页面或搜索词是否变化
  if (prevBucketState.currentPage !== currentBucketState.currentPage || 
      prevBucketState.searchTerm !== currentBucketState.searchTerm) {
    this.getBucketlists();
  }
}

额外提醒两点：

• 确保你的组件已经通过connect高阶组件正确把Redux的bucketlistState映射到props里了，不然this.props.bucketlistState会是undefined
• 只要getBucketlists方法不会无意义地重复修改currentPage或searchTerm，这个判断逻辑就能有效避免无限循环啦

内容的提问来源于stack exchange，提问作者kawerewagaba