vue2 封装axios

在Vue2中，我们可以通过封装axios来方便地管理接口和使代码更加简洁。一般来说，我们需要对axios进行两次封装。第一次封装是为了引入基地址和拦截器，第二次封装是为了进一步封装请求方法，使其更加符合我们的业务需求。下面是一个简单的Vue2封装axios的示例代码：

// 第一次封装
import axios from 'axios'

const service = axios.create({
  baseURL: 'http://api.example.com', // 基地址
  timeout: 5000 // 超时时间
})

service.interceptors.request.use(
  config => {
    // 在请求发送之前做一些处理
    return config
  },
  error => {
    // 处理请求错误
    return Promise.reject(error)
  }
)

service.interceptors.response.use(
  response => {
    // 在响应之前做一些处理
    return response.data
  },
  error => {
    // 处理响应错误
    return Promise.reject(error)
  }
)

export default service

// 第二次封装
import service from './service'

export function get(url, params) {
  return service({
    url: url,
    method: 'get',
    params: params
  })
}

export function post(url, data) {
  return service({
    url: url,
    method: 'post',
    data: data
  })
}

在上面的代码中，我们首先通过axios.create()方法创建了一个axios实例，并设置了基地址和超时时间。然后，我们通过service.interceptors.request.use()和service.interceptors.response.use()方法分别添加了请求拦截器和响应拦截器。接下来，我们通过第二次封装的get()和post()方法进一步封装了请求方法，使其更加符合我们的业务需求。最后，我们将封装好的axios实例和请求方法导出，以便在其他地方使用。