Redux:这是一个全能的动作创造者模式吗?

Ret*_*ver 2 javascript reactjs redux react-redux

我是新手.我不确定,使用下面的模式错误/愚蠢?

import { createAction, handleActions } from "redux-actions";

const CHANGE_STATE = "appState/CHANGE_STATE";

export const changeState = createAction(CHANGE_STATE, (key, val) => ({ [key]: val }));

const initialState = {
    maxBodySize: 1920,
    isMaxBody: true,
    isMobile: false
};

export default handleActions(
    {
        [CHANGE_STATE]: (state, { payload: changedState }) => {
            const newState = {
                ...state,
                ...changedState
            };
            return newState;
        }
    },
    initialState
);
Run Code Online (Sandbox Code Playgroud)

actionCreator每个州只有一个可编辑的.像这样:

// Can editable every state with 'changeState' action.
appState.changeState("isMaxBody", true);
appState.changeState("isMobile", true);
appState.changeState("maxBodySize", 960);
Run Code Online (Sandbox Code Playgroud)

我可以继续使用这个方便的模式吗?

如果这种模式不好,请给我一些指示.

Mik*_*ell 5

我可以继续使用这个方便的模式

我不明白你为什么"不能".从严格意义上说,这似乎是完全有效的.

至于它是否是一个好主意,嗯,这是开放的意见,但我不建议使用这种模式.这有以下几个原因:

  • 你失去了"行动"和"状态修改"之间的抽象.很高兴能够说"执行此操作",而不必担心实际的状态变化是什么.某些操作可能会修改多个州的部分.所有这一切都被抽象出来,使其更加可控和可测试.同样,出于类似的原因,这可能不适用于中间件.
  • 修改字符串属性"看起来很蹩脚",并且通常看起来容易出错.如果您不小心在应用程序中的某个位置输入了属性名称,那么您将无法获得工具方面的帮助.
  • 与上面类似,您失去了利用静态类型(例如flow或TypeScript)的能力.在团队中编写了一个相当大的React/Redux应用程序,我强烈建议使用类似TypeScript的东西,这种模式在强/静态类型的应用程序中不能很好地工作.

这些是我的观点,源于我的经验.如果该模式适合您以及您要完成的任务,您可能会发现它很好.

PS如果你打算使用这样的模式,我不明白为什么你不会这样做appState.changeState({isMaxBody: true});而不是appState.changeState("isMaxBody", true);.它似乎更清洁,至少更接近允许更好的打字.