填充多个商店并等待

Populating Multiple Stores and Waiting

考虑一个基于 Flux 的同构应用程序，并使用 Fluxible 库来实现它。您有一个 React 电子邮件应用程序，左侧是邮件列表，右侧是当前打开的邮件。

您的路由器在使用 URL '/message/123' 调用时触发 'SHOW_POST' 操作，该操作加载数据、更新存储，因此消息出现在正确的。这一切正常，导航承诺已解决并呈现页面。

但是，页面呈现时左侧没有消息列表。如果在 SHOW_POST 期间调用 'LOAD_ALL_MESSAGES' 的操作，它们实际上不会在服务器上呈现，服务器 returns 一个空列表，它们通过 AJAX 在客户端加载.

如何在其他组件需要的页面上填充其他商店。我尝试在呈现需要它们的组件时调用操作来填充它们，这似乎不干净，并且没有解决组件未在服务器端呈现的问题。

在所有导航操作中必须触发额外的操作来填充商店似乎同样不干净，因为可能不需要商店，代码会重复，因为我需要从几乎所有的调用这些填充操作各种导航操作。

在服务器端呈现期间填充后台存储的首选架构是什么。从每个导航中触发多个操作并等待它们全部解决？

这是我遵循的方法，

这种路由的action方法（需要多个店铺的数据）是这样的：

action: function (context, payload, done) {
  var getXData = new Promise(function(resolve){
    context.executeAction(getXDataAction, {}, resolve);
  });
  var getYData = new Promise(function(resolve){
    context.executeAction(getYDataAction, {}, resolve);
  });
  Promise.all([getXData, getYData]).then(function() { done() });
}

在这些操作中，我检查相关存储中的数据是否已经存在，以避免从外部获取数据。

或者，您可以创建另一个 action creator，然后将逻辑从路由移出到动作创建器。除了让你的路线精简之外，我看不出它有什么真正的好处。

填充多个商店并等待

Populating Multiple Stores and Waiting

flux

isomorphic-javascript

fluxible