4

アクションクリエーターに構成を注入する「Redux」の方法とは何ですか?

非同期アクション作成者を考えてみましょう:

export function login(username, password) {
    return (dispatch, getState) => {
        const service = Auth.createService(config); // <- that's the one

        service.login(username, password).then((data) => {
            const {token} = data;
            dispatch(success(token));
        }).catch((err) => {
            Logger.log(err);
        });
    };
}

ご覧のとおりAuthService、(および他のすべてのサービス) には、通常、次のようなものを定義する構成が必要です:baseUrlなどheaders

次のような方法で、それらをそれ自体requireで d にします。AuthService

import configfrom '../config/globalConfig`;

多くの理由で次善であり、特定のサービス インスタンスに対してそれらをオーバーライドすることはできません

ミドルウェア ( redux-thunk.

  1. getState私にとって、特に編集可能な場合、構成はアプリケーションの状態の一部であるため、すでに を介して既に注入されている可能性があります。

  2. クリエイターごとのオーバーライドはまだ許可されていません

コンテナー コンポーネントからアクション クリエーターに構成を直接渡すことは、this.props.dispatch(login(username, password, config));非常に冗長です。

4

1 に答える 1

4

私はinjectMiddlewareエステからこれはかなりきちんとしていると思います:

// Like redux-thunk with dependency injection.
const injectMiddleware = deps => ({ dispatch, getState }) => next => action =>
  next(typeof action === 'function'
    ? action({ ...deps, dispatch, getState })
    : action
  );

これにより、次のようなアクションクリエーターを書くことができます

export function login(username, password) {
   return ({ dispatch, getState, authService }) => {

authServiceミドルウェアの初期化中に挿入します。

于 2016-04-15T22:55:41.487 に答える