时间戳

首页 > 解决方案 > 定期在 React-Redux Connect 处停止调试

reactjs - 定期在 React-Redux Connect 处停止调试

问题描述

我使用 React-Redux 已经有一段时间了，但是在调试组件和存储之间交互的“连接”时我总是有一个问题，例如

ln    export default connect((state) => {
112     return {
113       isUserAdmin: isUserAdmin(state)
114     };
115   })(MainPage);

      isUserAdmin(state) {
222       // perform a heavy task...
      }

如果我在第 113 行放置一个断点，即使我没有对我的组件进行任何更改，我发现它每 1 秒定期触发一次，并且我的函数isUserAdmin(state) 正在一次又一次地执行并且永远不会停止了，这是由 react-redux 设计的吗？

我还发现在我的调用堆栈中有一些订阅触发了连接（mapStateToProps），这是否意味着在幕后 react-redux 正在使用某种订阅或承诺执行轮询来维护状态？

顺便说一句，如果我的isUserAdmin工作繁重，或者我通过执行其他方法传递了额外的 mapStateToProps，这是否会对我的应用程序性能产生很大影响，因为它似乎在后台无限运行？

标签： reactjsreact-reduxsubscription

解决方案

即使我没有对组件进行任何更改，我发现它每 1 秒定期触发一次。

  • 它与您在组件中所做的更改（本地组件状态更新）无关（除非您通过 dispatch 进行任何商店更新actions）。它只听store更新。
  • 第一次redux store在应用程序加载时以默认状态触发。随后的触发器取决于您通过调度在应用程序/组件中执行的商店更新actions。

这是否意味着在幕后 react-redux 正在使用某种订阅或承诺执行轮询以维护状态？

  • 是的。它订阅存储更新。事情在这里得到了很好的解释。

如果我的 isUserAdmin 工作繁重，或者我通过执行其他方法传递了额外的 mapStateToProps，这会对我的应用程序性能产生很大影响。

  • React将成为你的救星。如果状态/引用未更改，则 UI/组件不会重新渲染。

我建议您将isUserAdmin逻辑移动到反应组件并使用useMemo()钩子来获得性能优化以进行密集计算。供您参考。

推荐阅读