React Toolkit Redux extraReducers未触发问题求助

你遇到的extraReducer未触发的核心原因是你的Slice Reducer没有注册到Redux Store中，同时代码里还有一些细节可以优化：

1. 核心问题：Reducer未注册到Store #

你的Store配置只导入并合并了navigationReducer，但你创建的counter slice对应的reducer完全没被加入到Store的reducer列表里。Redux只会处理已注册的reducer，所以extraReducers里的逻辑根本不会被执行。

修复后的Store代码：

import navigationReducer from "./navigationSlice";
import counterReducer from "./counterSlice"; // 导入你的counter slice reducer
const { combineReducers, configureStore } = require("@reduxjs/toolkit")

export default configureStore({
  reducer: combineReducers({
    selectedElement: navigationReducer,
    counter: counterReducer // 将你的reducer加入到这里
  }),
});

2. 其他优化点 #

（1）AsyncThunk命名简化 #

createAsyncThunk的第一个参数不需要手动添加/ful后缀，Redux Toolkit会自动为这个thunk生成pending/fulfilled/rejected三种状态的action类型，手动加后缀完全多余。

（2）Fetch代码简化 #

你当前的fetch写法混合了await和嵌套then，既不简洁也容易出错，建议统一使用async/await语法：

export const fetchItens = createAsyncThunk('table/fetchItens', async (payload, thunkAPI) => {
  let url = '';
  if (payload.serie === 0) {
    url = 'http://localhost:3006/campeonatos/brasileiraoA';
  } else if (payload.serie === 1) {
    url = 'http://localhost:3006/campeonatos/brasileiraoB';
  }
  
  if (!url) return null;
  
  try {
    const response = await fetch(url);
    const data = await response.json();
    if (data.error) {
      console.log("Ocorreu um erro.");
      return null;
    }
    return data.dados;
  } catch (err) {
    console.error('Ocorreu um erro.', err);
    return thunkAPI.rejectWithValue(err); // 用这个抛出错误，方便在rejected状态处理
  }
})

（3）状态选择器修正 #

你的getDates选择器写法错误，因为你的reducer在Store里的键是counter，所以应该从state.counter里取dates：

export const getDates = (state) => state.counter.dates;

（4）Slice内状态更新简化 #

Redux Toolkit的createSlice允许直接修改状态（内部有Immer做处理），不需要返回新对象：

reducers: {
  setDate: (state, { payload }) => {
    state.dates = payload.dates; // 直接赋值即可
  }
}

（5）extraReducer容错处理 #

在fulfilled里加个判断，避免payload为null时map报错：

builder.addCase(fetchItens.fulfilled, (state, { payload }) => {
  if (payload) {
    state.dates.push(...payload); // 用扩展运算符比map+push更高效
  }
})

内容的提问来源于stack exchange，提问作者Biel