从flummox动作/存储访问路由器

Question

我希望能够在Flummox操作中进行API调用，并根据响应进行不同的转换。我可以将路由器传递到动作呼叫中，但我正在寻找一种可能更好的方法的建议。

更新：

正确的答案如下，但我想补充一些细节。

我正在做一个同构应用程序，1.需要从api获取数据，2.可能需要基于api响应重定向。无论我做什么，都需要通过express.js应用程序和react来完成工作。

我做了一个小库，它调用api并返回一些结果。我向它传递一个对象(查询params对象来自服务器端的express或为react端创建的类似对象)。这个库发出请求，确定是否需要重定向，并传回错误、路径(字符串)、重定向(布尔值)和数据(json)。

如果重定向布尔值为true，则使用当前查询参数重定向到它。如果是假的，我会通过更新存储的操作传递数据。然后，我使用react进行renderToString，序列化存储，以便clint端可以引导，并将呈现的页面发送给客户端。

在react中，重定向布尔值并不重要，我从lib获得响应，将数据传递给我的通量操作，然后转换到任何路径。根本就没有重定向的概念。无论如何都要走到这条路上。

希望这对某人有帮助。

Answer 1

在我的设置中，我有自己的路由器模块，它只是包装我在启动时创建的react-router实例。这使得应用程序的任何部分都很容易只需要该模块并做它需要的事情。

但我建议你不要有副作用，比如在你的行动中呼叫路由器。操作应该关注您的应用程序状态的变异，而不是更多。应该可以从应用程序中的任何地方调用相同的操作，这需要执行操作封装的突变。

因此，如果您在操作期间切换路由，则基本上是将该操作绑定到特定的用例中。让我们举个例子。您有一个待办事项列表，底部有一个输入框来添加一个新的待办事项。对于该用例，在保存了todo之后切换路由可能是有用的。也许你换了最近的Todos或者什么的。但是随后出现了一个新的用例，您希望能够在另一个工作流中添加新的待办事项，也许用户正在计划她的工作周，并且应该能够在不同的日子添加待办事项。您希望使用添加待办事项的相同操作，但您肯定不希望切换路由，因为用户仍在计划这一周。

我没有经常使用Flummox，但据我所知，当触发一个操作时，您的Flux对象会返回该操作返回的任何内容。因此，不要将路由更改放在操作中，请确保从操作返回响应，并让组件决定是否应该更改路由。就像这样：

// todo-action.js
class TodoActions extends Actions {
  createMessage(todo) {
    return TodoStore.saveToServer(todo);
  }
}

// todo-list.js
const TodoList extends React.Component {
  render() {
    ...
  }
  addTodo(todo) {
    this.props.flux.addTodo(todo).then(response => {
      if (response.some.prop === someValue) {
        this.props.router.transitionTo(...);
      }
    });
  }
}

这样，操作仍然与路由更改很好地解耦。如果您想在多个地方进行路由切换，可以将其封装在您的Flux类中的addTodoAndSwitchRoute方法中。