我正在使用RTK和RTK查询在我的应用程序中进行状态管理和数据提取。我的商店是通过代码分割设置的,我在应用程序Uncaught TypeError: Cannot read property 'matchFulfilled' of undefined
的初始加载时收到以下与storeNew/authSliceNew.js
中定义的extraReducer
相关的错误
到目前为止,我意识到,如果我在storeNew/authSliceNew.js
中注解掉我的extraReducers
,重新加载应用程序,然后取消注解,它们似乎可以工作。但是如果我从一开始就取消注解,我会得到错误。我试图找到一个解决方案,但到现在为止已经有几个小时了,但找不到任何有用的东西。所以如果有人能给我指出正确的方向,我会很高兴。
我的storeNew/baseApi.js
import { createApi, fetchBaseQuery } from "@reduxjs/toolkit/query/react";
export const baseApi = createApi({
baseQuery: fetchBaseQuery({ baseUrl: "api/" }),
endpoints: () => ({}),
tagTypes: ["User", "Budget"],
});
我的storeNew/authApiNew.js
import { baseApi } from "./baseApi";
const authApi = baseApi.injectEndpoints({
endpoints: (builder) => ({
registerUser: builder.mutation({
query: (registerCredentials) => ({
url: "account/register",
method: "POST",
body: { ...registerCredentials },
}),
}),
}),
overrideExisting: false,
});
export const {
useRegisterUserMutation,
} = authApi;
我的storeNew/authSliceNew.js
import { createSlice } from "@reduxjs/toolkit";
import { baseApi } from "./baseApi";
const initialState = {
isAuthenticated: false,
register_success: false,
feedback: null,
feedbackType: null,
};
const authSlice = createSlice({
name: "auth",
initialState: initialState,
reducers: {
resetFeedback: (state) => {
state.feedback = null;
state.feedbackType = null;
},
resetRegisterSuccess: (state) => {
state.register_success = false;
},
},
extraReducers: (builder) => {
builder.addMatcher(
baseApi.endpoints.registerUser.matchFulfilled,
(state) => {
state.register_success = true;
state.feedback = null;
state.feedbackType = null;
}
);
},
});
export const authActions = authSlice.actions;
export default authSlice;
我的storeNew/index.js
import { configureStore } from "@reduxjs/toolkit";
import { setupListeners } from "@reduxjs/toolkit/query";
import { baseApi } from "./baseApi";
import authSliceNew from "./authSliceNew";
const store = configureStore({
reducer: {
[baseApi.reducerPath]: baseApi.reducer,
authNew: authSliceNew.reducer,
},
middleware: (getDefaultMiddleware) =>
getDefaultMiddleware().concat(baseApi.middleware),
});
setupListeners(store.dispatch);
export default store;
1条答案
按热度按时间bprjcwpo1#
如果您在此处访问
baseApi.endpoints.registerUser.matchFulfilled
,则无法保证registerUser
端点已在该时间点注入(即:注入它的文件已经被包括)。导出
authApi
,并使用authApi.endpoints.registerUser.matchFulfilled
。authApi
和baseApi
是同一个对象(字面意思是对同一个对象的引用!),但是在authApi
对你可用的时候,你可以保证已经对registerUser
进行了injectEndpoints
调用。