是否可以使用Redux Toolkit从另一个reducer函数(在同一片内)调用reducer函数?

时间:2020-08-24 15:56:37

标签: javascript reactjs redux react-redux redux-toolkit

我有这个小模块管理片:

const WorkspaceSlice = createSlice({
    name: "workspace",
    initialState: {
        activeModule: null,
        modules:
        {
            ["someModule"]: { ...moduleRenderingData },
        },
    },
    reducers: {
        setActiveModule(state, action)
        {
            state.activeModule = action.payload;
        },
        addModule(state, action)
        {
            const { moduleName, renderingData } = action.payload; 
            if (!state.modules[moduleName])
            {
                state.modules[moduleName] = renderingData;
            }

            // state.activeModule = moduleName; <- basically the same as 'setActiveModule'
            this.setActiveModule(state, action.payload.module); // <- 'this' is undefined
        },
    },
});

export default WorkspaceSlice;

我想做的是从setActiveModule中调用addModule,这样我就不会有重复的代码,但是由于this是未定义的,所以我得到了一个错误。
有没有办法从另一个内部调用一个reducer?它的语法是什么?
如果没有,假设我想将addModulesetActiveModule都保留为单独的动作,是否有可能以另一种方式实现此功能?

1 个答案:

答案 0 :(得分:4)

slice返回的createSlice对象包括您以slice.caseReducers形式传递的每个大小写简化函数,以帮助解决这种情况。

因此,您可以这样做:

addModule(state, action) {
    const { moduleName, renderingData } = action.payload; 
    if (!state.modules[moduleName]) {
        state.modules[moduleName] = renderingData;
    }

    WorkspacesSlice.caseReducers.setActiveModule(state, action);
},

此外,由于不涉及类实例,所以reducer函数没有this。它们只是功能。