0

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

更新：

正确答案如下，但我想为此添加一些细节。

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

我做了一个小库来执行 api 调用并返回一些结果。我将一个对象传递给它（从 express 中查询参数对象用于服务器端或我为反应端创建的类似对象）。这个库发出请求，确定是否需要重定向并传回错误、路径（字符串）、重定向（布尔值）和数据（json）。

在 express 中，如果重定向布尔值为真，我只需使用当前查询参数重定向到它。如果它是假的，我通过一个更新商店的动作将数据传递给flux。然后，我使用 react 渲染ToString，序列化存储，以便 clint 端可以引导，并将渲染页面发送到客户端。

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

希望这对某人有帮助。

4

1 回答 1

1

在我的设置中，我有自己的路由器模块，它只是包装了react-router我在启动时创建的实例。这使得应用程序的任何部分都可以轻松地只需要该模块并执行所需的操作。

但我建议您不要在您的操作中产生诸如调用路由器之类的副作用。动作应该关注改变你的应用程序状态，仅此而已。应该可以从应用程序中需要执行动作封装的突变的任何地方调用相同的动作。

因此，如果您在某个操作期间切换路线，您基本上就是将该操作与该特定用例联系起来。让我们举个例子。您有一个待办事项列表，底部有一个输入框，用于添加新的待办事项。对于该用例，在保存待办事项后切换路线可能很有用。也许你切换到最近的待办事项或其他东西。但是随后出现了一个新的用例，您希望能够在另一个工作流程中添加新的待办事项，也许用户正在计划她的一周并且应该能够在不同的日子添加待办事项。您想要添加待办事项的相同操作，但您当然不想切换路线，因为用户仍在计划一周。

我没有经常使用 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(...);
      }
    });
  }
}

这样，动作仍然很好地与路线变化脱钩。如果您想在多个地方进行路由切换，您可以将其封装在addTodoAndSwitchRouteFlux 类中的一个方法中。

于 2015-05-22T06:14:45.460 回答