2016-05-20 2 views
0

2番目のページのロード中に3番目のページが呼び出されたときに、あるページから別のページへの現在の遷移をブロックする方法を調べました。例はこれです:React-router + redux:別のトランジションが呼び出されたときにアクティブな遷移を中止します。

私は3つのリンク(A、B、C)とメニューを持っている、と私はページにいるリンクAに対応するに

私はリンクBをクリックして、反応送りますサーバーへの要求

リンクBからページが返される前に、私はページBの前にリンクC.

ページCの負荷をクリックしますが、時のページBに戻り、ページBがロードされます。

現在アクティブなトランジションを無視するように反応する方法はありますか?リンクBからの応答を無視しますか?

ありがとうございました!

答えて

0

これは多くの実装の詳細によりますが、実際の例を挙げておきます:私はcancellationを実装するbluebird promiseライブラリを十分に利用してこれを処理します。読み込んで「ページB」は(おおよそ)このようなものだろう:

const pageRequests = {}; 

function loadPageB() { 
    return (dispatch) => { 
    pageRequests.pageB = makeAsyncRequest('pageB') 
     .then((res) => dispatch({type: 'LOAD_PAGE', content: res}) 
     .finally(() => { 
     delete pageRequests['pageB']; 
     }); 
    }; 
} 

function cancelLoad(page) { 
    pageRequests[page].cancel(); 
} 

をあなたは(要求を取り消しれる、ページの読み込みを中止するcancelLoadを呼びたいページの読み込み約束を生成する関数が必要になりますのでご注意取り消しをサポートする!)。

また、約束を取り消したくない場合は、そのページの結果を見たくないことを示すフラグを保存することもできます。このフラグは、ページをロードする要求を開始するたびにリセットされます。

関連する問題