React Redux与redux-observable使用路由器在异步操作完成后导航到不同的页面

Question

我正在使用redux-observable,这是我的登录史诗:

const login = ( action$ ) => {
    return action$.ofType(SessionActions.LOGIN_USER)
      .flatMap(( {payload} ) => {
        return sessionService.login(payload)
          .do(payload => {
            sessionService.setSession(payload));
          // Here I want to redirect the user back to his last location
          }).map(result => ({
            type: SessionActions.LOGIN_SUCCESS,
            payload: result
          }));
      });
  }

但是,在登录操作成功后,我如何将用户重定向到其他页面.

redux的方法是什么？

Answer 1

如果你对react-router-redux使用redux-observable,你可以在史诗中进行任何重定向:

import { ajax } from 'rxjs/observable/dom/ajax';
import { push } from 'react-router-redux';
import NProgress from 'nprogress';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/mergeMap';

export default function login(action$) {
  return action$.ofType('LOGIN_USER')
    .do(() => NProgress.start())
    .mergeMap(payload => (
       // Call your login service here, please note that it must be an observable to continue in your epic chain.
       Observable.fromPromise(sessionService.setSession(payload))
         // This is the redirect you're looking for, it's now became an action thanks to react-router-redux :)
         .mapTo(push({ url: '/' }))
         .do(() => NProgress.done())
  ));
}

我甚至为奖励积分添加了一个进度指示器:)它是在redux-observable自己的导航示例的帮助下构建的