基于ts封装fetch

当使用 TypeScript 封装 Fetch API 时，可以按照以下步骤进行：

1. 首先，创建一个名为 `api.ts` 的文件，并在其中定义一个函数来封装 Fetch。可以参考以下示例：

async function request<T>(url: string, options?: RequestInit): Promise<T> {
  const response = await fetch(url, options);
  if (!response.ok) {
    throw new Error(response.statusText);
  }
  return await response.json() as T;
}

export default request;

这个函数接受两个参数：`url` 表示请求的 URL，`options` 是可选的 Fetch 配置对象。

2. 接下来，你可以在其他文件中使用这个封装的函数来发送请求。例如：

import request from './api';

interface User {
  id: number;
  name: string;
}

async function fetchUser(userId: number): Promise<User> {
  const url = `https://api.example.com/users/${userId}`;
  const user = await request<User>(url);
  return user;
}

// 使用示例
fetchUser(123)
  .then(user => console.log(user))
  .catch(error => console.error(error));

在这个示例中，我们定义了一个 `User` 接口来表示从 API 返回的用户数据类型。然后，我们使用 `request` 函数发送了一个 GET 请求，获取了指定 ID 的用户信息并返回。

这只是一个简单的示例，你可以根据实际需求进行扩展和修改。封装 Fetch 可以帮助你在应用中统一处理请求和错误，并提供更好的可维护性和可扩展性。