reactjs - 我可以在 Flux 中使用动作来控制路线，如何？

Question

我正在 Flux 中编写一个身份验证模块，操作：auth、auth_success、auth_error。我在想当动作 auth_error 发生时，路由器将转到“/登录”。当 action, action, auth_success 发生时，路由器将转到'/dashboard'。但这似乎是错误的，因为动作只交给调度员。我不知道如何路由回调。也许检查商店价值？

Answer 1

例如，您必须mixin使用 Route.Navigation 对象到您的 React 类

/** @jsx React.DOM */

var React = require('react');

var Router = require('react-router')
  , Navigation = Router.Navigation;

var UserStore = require('user-store');

var YourClass = module.exports = React.createClass({
  mixins:[Navigation], //This is very important

  getInitialState: function() {
    return {};
  },

  componentWillMount: function(){
    UserStore.addChangeListener(this._method);
  },
  componentWillUnmount: function(){
    UserStore.removeChangeListener(this._method);
  },

  render: function() {
    return (
      <div>
      </div>
    );
  },

  _method: function() {
    // From here you can call methods of Navigator Object
    this.transitionTo('SomeRouteName'); //This method will render the specified <Route>
  } 
});

有关更多信息，您可以查看 https://github.com/rackt/react-router/blob/master/docs/api/mixins/Navigation.md

为了改变路线并根据通量架构，您应该transitionTo从您应该拥有的一些用户存储的回调中调用。

我在代码中添加了一个示例，您可以根据您的具体情况对其进行自定义。

快乐编码！