vue2封装axios请求

Vue2中封装Axios请求可以按照以下步骤进行：

1. 首先，安装axios和vue-axios依赖。在命令行中运行以下命令：

npm install axios vue-axios --save

2. 在Vue的入口文件（例如main.js）中导入axios和vue-axios，并使用Vue.use()方法将vue-axios注册为Vue插件：

import axios from 'axios';
import VueAxios from 'vue-axios';

Vue.use(VueAxios, axios);

3. 创建一个api.js文件用于封装所有的接口请求。在api.js文件中，可以定义一个全局的axios实例，并设置基础URL、请求拦截器和响应拦截器等：

import axios from 'axios';

const instance = axios.create({
  baseURL: 'http://api.example.com', // 设置基础URL
});

// 请求拦截器
instance.interceptors.request.use(
  (config) => {
    // 在发送请求之前做一些处理，例如添加请求头
    config.headers.Authorization = 'Bearer token';
    return config;
  },
  (error) => {
    return Promise.reject(error);
  }
);

// 响应拦截器
instance.interceptors.response.use(
  (response) => {
    // 对响应数据进行处理，例如获取返回的数据
    return response.data;
  },
  (error) => {
    return Promise.reject(error);
  }
);

export default instance;

4. 在需要发送请求的组件中，导入api.js文件，并使用封装好的axios实例发送请求：

import api from './api.js';

// 发送GET请求
api.get('/users')
  .then((response) => {
    // 处理返回的数据
    console.log(response);
  })
  .catch((error) => {
    // 处理错误
    console.error(error);
  });

// 发送POST请求
api.post('/users', { name: 'John Doe' })
  .then((response) => {
    // 处理返回的数据
    console.log(response);
  })
  .catch((error) => {
    // 处理错误
    console.error(error);
  });