84 lines
2.2 KiB
Markdown
84 lines
2.2 KiB
Markdown
# Request 工具使用说明
|
||
|
||
## 概述
|
||
|
||
`src/utils/request.ts` 已经适配了后台生成的 API 代码格式，支持两种使用方式：
|
||
|
||
## 1. 标准方式（适配后台生成代码）
|
||
|
||
后台生成的代码使用 `request.get<ApiResult>` 格式，返回完整的 `ApiResult` 响应：
|
||
|
||
```typescript
|
||
// 后台生成的代码格式
|
||
export async function pageCmsNavigation(params: CmsNavigationParam) {
|
||
const res = await request.get<ApiResult<PageResult<CmsNavigation>>>(
|
||
'/cms/cms-navigation/page',
|
||
params
|
||
);
|
||
if (res.code === 0) {
|
||
return res.data;
|
||
}
|
||
return Promise.reject(new Error(res.message));
|
||
}
|
||
```
|
||
|
||
## 2. 便捷方式（自动提取数据）
|
||
|
||
如果你想要自动提取 `data` 字段，可以使用 `getData` 系列方法：
|
||
|
||
```typescript
|
||
import request from '@/utils/request';
|
||
|
||
// 自动提取 data 字段
|
||
const data = await request.getData<CmsNavigation[]>('/cms/cms-navigation');
|
||
|
||
// 等价于
|
||
const res = await request.get<ApiResult<CmsNavigation[]>>('/cms/cms-navigation');
|
||
const data = res.data;
|
||
```
|
||
|
||
## 可用方法
|
||
|
||
### 标准方法（返回完整 ApiResult）
|
||
- `request.get<T>(url, params?, config?)`
|
||
- `request.post<T>(url, data?, config?)`
|
||
- `request.put<T>(url, data?, config?)`
|
||
- `request.del<T>(url, data?, config?)`
|
||
- `request.patch<T>(url, data?, config?)`
|
||
|
||
### 便捷方法（自动提取 data）
|
||
- `request.getData<T>(url, params?, config?)`
|
||
- `request.postData<T>(url, data?, config?)`
|
||
- `request.putData<T>(url, data?, config?)`
|
||
- `request.delData<T>(url, data?, config?)`
|
||
|
||
## 配置选项
|
||
|
||
```typescript
|
||
interface RequestConfig {
|
||
url: string;
|
||
method?: 'GET' | 'POST' | 'PUT' | 'DELETE' | 'PATCH';
|
||
data?: any;
|
||
header?: Record<string, string>;
|
||
timeout?: number;
|
||
retry?: number;
|
||
showLoading?: boolean;
|
||
showError?: boolean;
|
||
returnRaw?: boolean; // 内部使用，控制返回格式
|
||
}
|
||
```
|
||
|
||
## 错误处理
|
||
|
||
所有请求都会自动处理：
|
||
- 网络错误
|
||
- 超时错误
|
||
- 认证错误（自动清除登录信息并跳转）
|
||
- 业务错误（显示错误提示）
|
||
|
||
## 注意事项
|
||
|
||
1. **后台生成的代码无需修改**，直接使用 `request.get<ApiResult>` 格式
|
||
2. **新写的代码**可以选择使用 `getData` 系列方法来简化代码
|
||
3. 所有方法都支持自动重试、错误处理、认证等功能
|