reactjs - Redux 工具包 combineReducers 问题。 :Store does not have a valid reducer. 确保传递给 combineReducers 的参数是一个对象，其

Question

请告诉我我做错了什么？配置商店.js:

import {configureStore, combineReducers} from "@reduxjs/toolkit";
import pokemonSearchSlice from "./slices/pokemonSearch";

const reducer = combineReducers({
pokemonSearch: pokemonSearchSlice
});

const store = configureStore({
reducer
});



export default store;

口袋妖怪搜索

import { createSlice } from "@reduxjs/toolkit";



const pokemonSearchSlice = createSlice({
    name: "pokemonSearch",
    initialState: {
        searchInputValue: ""
    },
    reducers: {
setValue:(state, action)=>({...state, searchInputalue: action.payload})
    }
}) ;



export const {setValue} = pokemonSearchSlice.actions;

export default pokemonSearchSlice;

错误全文:redux.js:394 Store 没有有效的 reducer。确保传递给 combineReducers 的参数是一个值为 reducers 的对象。此外，我无法从商店获取“searchInputValue”，控制台显示:无法解构“(0，react_redux__WEBPACK_IMPORTED_MODULE_2__.useSelector)(...)”的属性“searchInputValue”，因为它未定义。但我认为这是因为 combineReducers 错误。有什么建议吗？

Answer 1

这里有几个问题:

• configureStore 会自动为您调用 combineReducers，因此您不想直接这样做。
• configureStore 的 reducer 对象需要 reducer，但您向它传递了一个切片。 (切片包含一个缩减器，但切片本身不是缩减器。)
• 您的 setValue 正在返回一个新对象，但 RTK 使用 Immer，因此您应该改变传递给函数的状态而不返回任何内容。

最后你的代码应该是这样的:

// configureStore.js
import { configureStore } from "@reduxjs/toolkit";
import pokemonSearchSlice from "./slices/pokemonSearch";

const store = configureStore({
  reducer: {
    pokemon: pokemonSearchSlice,
  },
});

export default store;

// slices/pokemonSearch.js"
import { createSlice } from "@reduxjs/toolkit";

const pokemonSearchSlice = createSlice({
  name: "pokemonSearch",
  initialState: {
    searchInputValue: "",
  },
  reducers: {
    setValue: (state, action) => {
      state.searchInputValue = action.payload;
    },
  },
});

export const { setValue } = pokemonSearchSlice.actions;

export default pokemonSearchSlice.reducer;