在Redux Toolkit中，实现一个带有异步逻辑的slice，例如分页加载数据，如何使用createAsyncThunk和extraReducers保持代码的简洁与类型安全？

在Redux Toolkit中，createAsyncThunk和extraReducers是处理异步逻辑和管理其状态的绝佳工具。以下是如何使用它们来实现带有分页加载数据的slice的示例，同时保持代码简洁与类型安全。

文末有我帮助400多位同学成功领取到前端offer的面试综合题哦，包含了工程化，场景题，八股文，简历模板，等等

1. 定义类型和常量

首先，定义一些基本的类型和常量来描述数据结构和动作类型。

// types.ts
export interface PaginatedData<T> {
  items: T[];
  totalCount: number;
  currentPage: number;
  pageSize: number;
}

// actionTypes.ts
export enum ActionTypes {
  FETCH_DATA = 'FETCH_DATA',
  FETCH_DATA_SUCCESS = 'FETCH_DATA_SUCCESS',
  FETCH_DATA_FAILURE = 'FETCH_DATA_FAILURE',
}

2. 创建异步 thunk

使用createAsyncThunk定义一个异步动作创造器，用于分页加载数据。

// api.ts
// 假设这是你的API接口
export const fetchPaginatedData