Question

如何更新个人资料？我正在创建用户可以更改其个人资料的位置。

Object {    
   "profile": Object {
      "name": Object {},
      "address": Object {},
   "settings": Object {
      "editName": Object {},
      "editAddress": Object {},
   }
}

Reducer.js。

import {combineReducers} from 'redux';
import {ProfileReducer as profile} from '../routes/Profile/modules/Profile';
import {SettingsReducer as settings} from '../routes/Settings/modules/Settings';

export const makeRootReducer = () => {
    return combineReducers({
        profile,
        settings
    });
}

export default makeRootReducer;

这是我在设置reducer中的代码。当我运行应用程序时，在设置对象内创建一个新对象。设置和配置文件缩减器位于不同的文件夹中。 我没有把整个代码

SettingsReducer.js

export function saveEdit(type){
    return (dispatch,getState) => {
        var storeData = '';
        var editType = '';
        var allState = getState();
        var profile = getState().profile;
        if(type == 'Name'){
            storeData = allState.settings.editName;
            editType = 'name';
        }
        else if(type == 'Address'){
            storeData = allState.settings.editAddress;
            editType = 'address';
        }
        dispatch({
            type: SAVE_EDIT,
            ...profile,
            [editType]: storeData                     
        })
    }
}

function handleSaveEdit(state,action){
    return update(state,{
        profile: {
            $set: action.profile
        }
    });
}
const ACTION_HANDLERS = {
    SET_NAME: handleSetName,
    SET_ADDRESS: handleSetAddress,
    SAVE_EDIT: handleSaveEdit,
};


const initialState = { 
    editName: {},
    editAddress: {},
};

export function SettingsReducer(state = initialState,action){
    const handler = ACTION_HANDLERS[action.type];

    return handler? handler(state,action) : state;
}

我希望如果用户点击保存按钮，设置对象中的数据将更改配置文件对象中的数据。

Answer 1

因为你已经合并了减速器，所有动作都会传递给所有减速器。因此，您可以调度一个操作，并因此更新多个Reducer。

假设您要在调度类型'SAVE_EDIT'的操作时更新配置文件的状态，您可以让profileReducer响应该类型的操作。

让我们假设profileReducer看起来有点像这样：

const INITIAL_STATE = {}

const profileReducer = (state = INITIAL_STATE, action) => {
  switch (action.type) {
    case 'PROFILE_RESET':
      return INITIAL_STATE
    ... // other cases
    default:
      return state
  }
}

export default profileReducer

然后，您可以简单地为'SAVE_EDIT'添加一个案例，并在调度该类型的操作时执行。

case 'SAVE_EDIT': {
  const newState = ... // Generate newState using state and action
  return newState
}

如何从不同的reducer更新状态？

1 个答案: