私は<a href="https://github.com/redux-observable/redux-observable" rel="nofollow">redux-observable</a>を使用しています

Question

完全な非同期動作後の別のページに移動するにはReduxの観察可能使用してルータをReduxのを反応させ、これが私のログイン叙事詩である：

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 
      })); 
     }); 
    } 

しかし、私は別のにユーザーをリダイレクトしていますかログイン操作が成功した後のページ。

これを行うにはどのような方法がありますか？

Answer 1

私は全く反応しません/ redux、私はあなたと同じ問題に直面しているので、私はログインページで小さなAPPを作成します。

だから、

// On your Login.JS you could implement the component lifecycle 

componentWillReceiveProps(nextProps) { 
    if (nextProps.isAuthenticated){ 
     this.context.router.push({pathname:'/'}); 
    } 
} 

、あなたの「アクション」「は減速」にタイプを送信：LOGIN_SUCCESSはあなたが対応する状態を変更しようと、あなたのコンポーネントは、あなたがチェックし、リダイレクトしようとして「小道具を受ける」とき。私はこの小さな例があなたを助けることを願っていますあなたはreact-router-reduxでredux-observableを使用する場合は

Answer 2

、あなたの叙事詩内の任意のリダイレクトを行うことができます。

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's own navigation example