TypeScript使用Fetch请求接口

// 定义接口返回数据的类型
interface ApiResponse {
  status: string;
  data: any;
}
 
// 使用fetch请求接口的函数
async function fetchApi(url: string): Promise<ApiResponse> {
  try {
    const response = await fetch(url);
    if (!response.ok) {
      throw new Error(`HTTP error! Status: ${response.status}`);
    }
    return await response.json();
  } catch (error) {
    console.error("Fetch error:", error);
    return { status: "error", data: null };
  }
}
 
// 使用示例
const url = "https://api.example.com/data";
fetchApi(url).then(response => {
  if (response.status === "success") {
    console.log("Data received:", response.data);
  } else {
    console.log("Error fetching data.");
  }
});

这段代码定义了一个ApiResponse接口来规定API响应的结构，并实现了一个fetchApi函数，它使用fetch来请求数据，并处理可能发生的错误。然后，我们提供了一个使用该函数的示例，展示了如何调用这个函数并处理返回的数据。