アクションクリエイターでReduxの状態にアクセスするには？質問する

Question

アクションクリエイターで状態にアクセスすることが良いアイデアであるかどうかについては、さまざまな意見があります。

Redux の作成者である Dan Abramov 氏は、制限すべきだと感じています。「許容できると思われる使用例は、リクエストを行う前にキャッシュされたデータをチェックする場合や、認証されているかどうかを確認する場合 (つまり、条件付きディスパッチを実行する場合) です。アクションクリエーターなどでデータstate.something.itemsを渡すことは、間違いなくアンチパターンであり、変更履歴がわかりにくくなるため推奨されません。バグがあり、正しくない場合、それらの誤った値がどこitemsから来たのかを追跡するのは困難です。なぜなら、それらはアクションに応答してリデューサーによって直接計算されるのではなく、すでにアクションの一部になっているからです。したがって、これは慎重に行う必要があります。」
現在のReduxメンテナーであるマーク・エリクソンは、サンクでの使用は問題なく、むしろ推奨されていると述べている。getStateそれがReduxが存在する理由だ。彼はブログ記事で、アクションクリエーターで状態にアクセスすることの長所と短所について論じている。イディオマティック・リダックス：サンク、サーガ、抽象化、再利用性についての考察。

これが必要だとわかったら、提案されたどちらのアプローチでも問題ありません。最初のアプローチではミドルウェアは必要ありません。

import store from '../store';

export const SOME_ACTION = 'SOME_ACTION';
export function someAction() {
  return {
    type: SOME_ACTION,
    items: store.getState().otherReducer.items,
  }
}

storeしかし、これは何らかのモジュールからエクスポートされたシングルトンに依存していることがわかります。これは、アプリにサーバーレンダリングを追加するほとんどの場合、サーバー上ではリクエストごとに別のストアが必要になるためです。したがって、技術的にはこのアプローチは機能しますが、モジュールからストアをエクスポートすることはお勧めしません。

これが、2 番目のアプローチを推奨する理由です。

export const SOME_ACTION = 'SOME_ACTION';
export function someAction() {
  return (dispatch, getState) => {
    const {items} = getState().otherReducer;

    dispatch(anotherAction(items));
  }
}

Redux Thunkミドルウェアを使用する必要がありますが、クライアントとサーバーの両方で問題なく動作します。Redux Thunkと、なぜそれが必要なのかについて詳しくは、こちらをご覧ください。ここ。

理想的には、アクションは「太ってはいけない」し、できるだけ情報量が少ないべきですが、自分のアプリケーションで最適なものを選んでください。Redux FAQには、アクションクリエーターとリデューサーの間でロジックを分割するそしてgetStateアクションクリエーターで使用すると便利な場合。

Answer 1