複数のReducerに分散したStateを同時に更新したい
react + Redux でアプリケーションを作成しています。
stateの中にReducerA、ReducerB、ReducerCが同じ階層で存在します。
actionXが発行された時に同時にReducerA、ReducerB、ReducerCにあるstateを更新したいのですが、
ReducerA、ReducerB、ReducerCそれぞれでactionXの処理をした場合、同時に更新されないと思います。
(ランダムな順番で処理される? 結果Componentが3回更新される?)
このような場合完全に同じタイミングでReducerA、ReducerB、ReducerCを更新するにはどうしたらよいでしょうか?
componentがupdateされる際データの不整合でエラーになったりします。
このようなパターンについて詳しい方がいたらご教授いただけると幸いです。
##追記:State全体の構成
javascript
1const state = { 2 reducerA: { 3 a:"a" 4 } 5 6 reducerB: { 7 b:"b" 8 } 9 10 reducerC: { 11 c:"c" 12 } 13};
該当のソースコード ※initialState追記しました
javascript
1 2export const actionX = (a, b, c) => ({ 3 type: "ACTION_X", 4 payload: { a: a, b: b, c: c }, 5 meta: {}, 6 error: false 7}); 8 9const initialStateA = { 10 a: "", 11}; 12 13export function reducerA(state = initialStateA, action){ 14 switch (action.type) { 15 case "ACTION_X": 16 return Object.assign({}, state, { 17 a: action.payload.a 18 }); 19 } 20} 21 22const initialStateB = { 23 b: "", 24}; 25 26export function reducerB(state = initialStateB, action){ 27 switch (action.type) { 28 case "ACTION_X": 29 return Object.assign({}, state, { 30 b: action.payload.b 31 }); 32 } 33} 34 35const initialStateC = { 36 c: "", 37}; 38 39export function reducerC(state = initialStateC, action){ 40 switch (action.type) { 41 case "ACTION_X": 42 return Object.assign({}, state, { 43 c: action.payload.c 44 }); 45 } 46}
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2018/11/26 17:26
退会済みユーザー
2018/11/28 12:04
2018/11/28 12:52 編集