vue3+vite+axios调用接口实例

你可以按照以下步骤使用 Vue 3、Vite 和 Axios 调用接口：

1. 首先，确保你已经安装了 Vue 3 和 Vite。你可以通过以下命令来创建一个新的 Vue 3 项目：

npm init @vitejs/app my-vue-app --template vue

2. 进入项目目录：

cd my-vue-app

3. 安装 Axios：

npm install axios

4. 在你的 Vue 组件中，导入 Axios 并创建一个实例：

import axios from 'axios';

const api = axios.create({
  baseURL: 'https://api.example.com', // 替换为你的接口地址
});

export default api;

5. 在需要调用接口的组件中，引入你刚才创建的 Axios 实例，并使用它来发送请求：

import api from './api';

export default {
  data() {
    return {
      responseData: null,
    };
  },
  mounted() {
    this.fetchData();
  },
  methods: {
    async fetchData() {
      try {
        const response = await api.get('/data'); // 调用接口，替换为你的接口路径
        this.responseData = response.data;
      } catch (error) {
        console.error(error);
      }
    },
  },
};

这样，你就可以使用 Vue 3、Vite 和 Axios 来调用接口了。记得根据你的实际需求修改代码中的接口地址和路径。