Redux工具箱Async Thunk:无法读取未定义的属性

Question

我正在构建一个redux工具包网站，在那里我将有一个网格。因此，为了使用这个网格，我使用async thunk从后端获取数据，然后将其发送到我的redux切片。此代码正在运行，但当我与其他更改进行合并时，它停止了。我已经将默认导出更改为公共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;
}
),
};

Answer 1

我发现了这个问题。我在thunk中向gridSlice调度了一个操作，但切片也在导入thunk，所以它生成了一个循环依赖关系。