我正在構建一個 redux 工具包網站，在那里我將有一個網格。因此，為了使用這個網格，我使用 async thunk 從后端獲取資料，然后將其發送到我的 redux 切片。這段代碼正在作業，但是當我與另一個更改進行合并時，它停止了。我已經將默認匯出更改為 common export default test = { ... }，然后錯誤更改為“初始化前無法訪問測驗”。
我的切片：
import { createSlice, PayloadAction } from "@reduxjs/toolkit";
import { AnyObject } from "../../models/utils/anyObject";
import { PageResponse } from "../../models/utils/pageResponse";
import thunk from "../thunks/grid";
interface GridState {
data: PageResponse<AnyObject> | null;
carregando: boolean;
totalDeItems: number;
}
const initialState: GridState = {
data: null,
carregando: false,
totalDeItems: 0,
};
const gridSlice = createSlice({
name: "grid",
initialState,
reducers: {
setCarregando: (state, action: PayloadAction<boolean>) => {
state.carregando = action.payload;
},
},
extraReducers: (builder) => {
builder.addCase(thunk.getData.fulfilled, (state, { payload }) => {
state.data = payload;
state.totalDeItems = payload.totalItems;
});
},
});
export const gridActions = gridSlice.actions;
export default gridSlice;
我的笨蛋：
import { AsyncThunkAction, createAsyncThunk } from "@reduxjs/toolkit";
import { AnyObject } from "../../models/utils/anyObject";
import { PageOptions } from "../../models/utils/pageOptions";
import { PageResponse } from "../../models/utils/pageResponse";
import { gridActions } from "../slices/grid";
interface GridDataProps {
thunk: (
arg: PageOptions
) => AsyncThunkAction<PageResponse<AnyObject>, PageOptions, AnyObject>;
options?: PageOptions;
}
export default {
getData: createAsyncThunk(
"grid/data",
async (props: GridDataProps, { dispatch }) => {
dispatch(gridActions.setCarregando(true));
const response = await dispatch(
props.thunk(
props.options || {
currentPage: 1,
itemsPerPage: 4,
}
)
);
dispatch(gridActions.setCarregando(false));
const result = response.payload as PageResponse<AnyObject>;
return result;
}
),
};
uj5u.com熱心網友回復：
我發現了這個問題。我正在向gridSlice我的 thunk 中發送一個動作，但是切片也在匯入 thunk，所以它生成了一個回圈依賴。
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/374109.html