React + Flux-在多页面上卸载页面

Question

考虑一个多页应用程序，在该应用程序中，当您打开页面时，它将启动一个计时器，该计时器负责每n秒处理一次数据。 现在考虑您要转到另一页，如何保证计时器将停止（因为第二页将不需要该计时器）。

我将其实现如下：

App.jsx

onClickNavigateToPageA: function() { AppActions.goToA(); }

AppActions.js

goToA: function() {
   DispatchActionToLoadComponentPageA();
   DispatchActionToStartTimer();
}

现在，我单击以转到B页。如何告诉计时器停止计时？ 如果我对componentWillUnmount执行此操作（我相信是通过操作），那么我将在操作（加载页面B的操作）期间分派操作，所以这是错误的。

正确的方法是在加载页面A之后立即注册回调（将调用操作以禁用计时器），然后在加载任何其他页面时调用该回调？ 据我所知，该商店现在永远不应该涉及用于从服务器中获取数据的api（包括计时器，应该是动作创建者）。

Answer 1

您可以使用所需的任何JSON有效负载来分派操作，这意味着您可以按分派的操作本身的属性对操作类型进行分组。 在这种情况下， DispatchActionToLoadComponentPageA的有效负载可能是：

{ 
    type: 'pageLoad',
    page: 'pageA'
}

这与您可能会分派的其他类型的操作不同：

{ 
    type: 'xhrComplete',
    response: ...
}

现在，您的计时器可以侦听pageLoad类型的操作，并根据正在加载的页面是否需要计时器来自行启动/停止。

Answer 2

如果您不将计时器与商店一起使用，则不会使用动作和变动周期。 如果与商店有关，请使用助焊剂循环。 无论如何，我只会使用具有所需功能的通用“计时器”模块，并在需要时将其打开/关闭。