1. ホーム
  2. javascript

[解決済み] Redux reducerの内部でステートにアクセスするには?

2023-02-09 13:51:45

質問

私はあるreducerを持っていて、新しい状態を計算するために、アクションからのデータと、このreducerによって管理されていない状態の一部からのデータが必要です。 具体的には、以下に示すreducerにおいて、私は accountDetails.stateOfResidenceId フィールドにアクセスする必要があります。

initialState.jsです。

export default {
    accountDetails: {
        stateOfResidenceId: '',
        accountType: '',
        accountNumber: '',
        product: ''
    },
    forms: {
        blueprints: [

        ]
    }
};

formsReducer.jsです。

import * as types from '../constants/actionTypes';
import objectAssign from 'object-assign';
import initialState from './initialState';
import formsHelper from '../utils/FormsHelper';
export default function formsReducer(state = initialState.forms, action) {
  switch (action.type) {
    case types.UPDATE_PRODUCT: {
        //I NEED accountDetails.stateOfResidenceId HERE
        console.log(state);
        const formBlueprints = formsHelper.getFormsByProductId(action.product.id);
        return objectAssign({}, state, {blueprints: formBlueprints});
    }

    default:
      return state;
  }
}

index.js(ルートリデューサ)です。

import { combineReducers } from 'redux';
import accountDetails from './accountDetailsReducer';
import forms from './formsReducer';

const rootReducer = combineReducers({
    accountDetails,
    forms
});

export default rootReducer;

このフィールドにアクセスするにはどうすればよいですか?

どのように解決するのですか?

私なら サンク を使います。

export function updateProduct(product) {
  return (dispatch, getState) => {
    const { accountDetails } = getState();

    dispatch({
      type: UPDATE_PRODUCT,
      stateOfResidenceId: accountDetails.stateOfResidenceId,
      product,
    });
  };
}

基本的にはアクションで必要なデータをすべて取得し、そのデータをreducerに送ればよいのです。