vue3 ts 使用axios

在Vue 3和TypeScript中使用Axios的基本步骤如下：

1. 安装Axios：

npm install axios

2. 创建一个用于封装Axios的API服务模块：

// api.ts
import axios from 'axios';
 
const apiClient = axios.create({
  baseURL: 'https://your-api-url.com/',
  // 其他配置...
});
 
export default apiClient;

3. 在Vue组件中使用该模块发送请求：

<template>
  <div>
    <!-- 组件模板内容 -->
  </div>
</template>
 
<script lang="ts">
import { defineComponent } from 'vue';
import apiClient from './api';
 
export default defineComponent({
  name: 'YourComponent',
  setup() {
    // 发送GET请求
    const fetchData = async () => {
      try {
        const response = await apiClient.get('/your-endpoint');
        console.log(response.data);
      } catch (error) {
        console.error(error);
      }
    };
 
    // 在mounted钩子中调用
    fetchData();
 
    // 其他逻辑...
  },
});
</script>

确保在api.ts中正确设置了API的URL和其他配置。在组件内部，你可以使用apiClient发送不同类型的HTTP请求（GET, POST, PUT, DELETE等），并处理响应或错误。