如何更改 extraReducers 中另一个减速器的状态？

Question

假设我有以下生命周期操作。

builder.addCase(loginUser.pending, (state, action) => {
    state.isLoading = true;
}).addCase(loginUser.fulfilled, (state, action) => {
    state.isLoading = false;
    state.user = action.payload;
    // Change the Page to HomePage - using the location state from navigationSlice
    toast.success('Logged In User!');
}).addCase(loginUser.rejected, (state, action) => {
    state.isLoading = false;
    toast.error(action.payload);
});

我想调用 setLocation 方法来更改导航减速器的状态值。看看吧。

import {createSlice} from '@reduxjs/toolkit';
import {getCurrentPageLocation} from '../../utils';

const initialState = {
    location: getCurrentPageLocation()
};

const navigationSlice = createSlice({
    name: 'navigation',
    initialState,
    reducers: {
        setLocation: (state, action) => {
            state.location = action.payload;
        }
    },
    extraReducers: (builder) => {

    }
});

export const {setLocation} = navigationSlice.actions;

export default navigationSlice.reducer;

如何调用 extraReducers (loginUser.fulfilled) 内部的 setLocation 方法？现在我知道我可以使用 createAsyncThunk 中的 thunkAPI 来调度它，但我不喜欢这样做。我希望能够直接从 extraReducers 调用它，最好不要导入任何东西。

我尝试使用 ChatGPT 来帮助我，但它有点让我生气。这是作为一名民主党人。

Answer 1

Reducer 在 Redux-Toolkit 中仍然是纯函数。在

navigationSlice

状态切片中添加一个额外的情况来处理分派的

loginUser.fulfilled

操作。

示例：

const navigationSlice = createSlice({
  name: 'navigation',
  initialState,
  reducers: {
    setLocation: (state, action) => {
      state.location = action.payload;
    }
  },
  extraReducers: (builder) => {
    builder
      .addCase(loginUser.fulfilled, (state, action) => {
        state.location = /* update */
      });
  }
});