returnxアプリケーションで特定のアクションを聞く/反応する正しい方法

Question

私はAngularとngrxを使って最初のreduxアプリケーションを書いています。いくつかの機会に、私は一連のアクションを正しく "連結"する方法に疑問を感じました。私は例を挙げる。

私のアプリには顧客リストパネルと顧客詳細パネルがあり、ユーザーが特定の顧客を選択した場合詳細パネルに顧客情報を表示したいだけでなく、顧客リストパネルを非表示にします。

現在、私はCustomerSelectedアクションを送出して、サーバーから顧客の詳細をロードするエフェクト（副作用）をトリガーします。詳細がロードされると、私はCusomerDetailLoadedアクションをディスパッチし、ストアを顧客情報で更新します。また、顧客リストパネルを非表示にするアクションを送出するエフェクトがトリガーされます（HideCustomerList）。

これは受け入れ可能なのでしょうか、これを達成する良い方法がありますか？特にCustomerDetailLoadedがレイアウトの詳細と密接に結びついているように感じます。顧客の詳細パネルを非表示にするたびに私は間違いのように聞こえます。

おかげで、 甲

Answer 1

redux-observableライブラリーは、特定のアクションを聞いて、後に別のアクションをディスパッチするための良い方法を提供します。あなたはACTION_B後ACTION_Cを派遣したい場合は、

const rootEpic = (action$) => action$.ofType('ACTION_A').mapTo({ 
    type: 'ACTION_B' 
}); 

次はcombineEpicsヘルパー使用することができます：あなたはACTION_A後ACTION_Bを派遣する場合

はたとえば、あなたがこのような何かを行うことができ

を

const epicA = (action$) => action$.ofType('ACTION_A').mapTo({ 
    type: 'ACTION_B' 
}); 
const epicB = (action$) => action$.ofType('ACTION_B').mapTo({ 
    type: 'ACTION_C' 
}); 
const rootEpic = combineEpics(
    epicA, 
    epicB 
) 

詳細はdocumentationをご覧ください。