如何使用Redux设置存储



我正试图让我的redux工作与一个新的表单功能,我现在得到这个错误信息时,我试图显示我的主页。索引。reducer文件最初有我用于身份验证的教程中的认证和消息简化器,以前工作得很好,所以我没有为它们包含简化器。

我在configureStore索引中使用五个reducer的方式是否正确?reducer文件还是我必须放入一个combineReducer函数?

错误消息

Error: Expected the reducer to be a function.

index.reducer.js

export default configureStore({
// combine the reducers
reducer: {
user: userReducer,
fields: fieldsReducer,
diveSchool: diveSchoolReducer,
auth,
message
}
});

store.js

const middleware = [thunk];
const store = createStore(
rootReducer,
composeWithDevTools(applyMiddleware(...middleware))
+  window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
);
export default store;

user.reducer.js

import {createSlice} from "@reduxjs/toolkit";
export const userSlice = createSlice({
name: 'user',
initialState: {
dives: [],
},
reducers: {
// expects action creator to be called with a dive object
addDive: (state, action) => {
// append to the dives array
state.dives.push(action.payload)
},
deleteDive: (state, action) => {
// append to the dives array
state.dives.push(action.payload)
}
}
})
export const { addDive } = userSlice.actions;
export const { deleteDive } = userSlice.actions;
export default userSlice.reducer;

fields.reducer.js

export const fieldsSlice = createSlice({
name: 'diveLogFields',
initialState: {
current: [],
region: [],
diveType: [],
visibility: [],
diveSpot: [],
},
reducers: {},
extraReducers: {
// picks up the success action from the thunk
// [requireData.fulfilled.type]: (state, action) => {
//     // set the property based on the field property in the action
//     state[action.payload.field], action.payload.items
// }
}
})
export default fieldsSlice.reducer;

您正在使用@reduxjs/toolkit。当你调用configureStore函数时,它返回store。你正试图把这个商店作为减速机从redux到createStore。使用工具包时,您不应该使用createStore。您已经从index.reducer.js导出了存储。把它传递给提供商,你就可以设置了。

看来你正在使用错误的方法来组合减速器。多个减速机组合使用combineReducers功能

export default combineReducers({
// combine the reducers
reducer: {
user: userReducer,
fields: fieldsReducer,
diveSchool: diveSchoolReducer,
auth,
message
}
});

最新更新