vue封着axios请求

Vue封装Axios请求的步骤如下：

1. 创建一个axios实例并设置默认配置，如设置请求超时时间、baseURL等。

import axios from 'axios'

const instance = axios.create({
  baseURL: 'http://localhost:3000',
  timeout: 1000,
  headers: {'X-Custom-Header': 'foobar'}
})

2. 创建一个请求拦截器，可以在发送请求前进行一些操作，如添加token等。

instance.interceptors.request.use(config => {
  // 在发送请求之前做些什么
  config.headers.Authorization = localStorage.getItem('token')
  return config
}, error => {
  // 对请求错误做些什么
  return Promise.reject(error)
})

3. 创建一个响应拦截器，可以在接收到响应后进行一些操作，如判断返回状态码、处理错误信息等。

instance.interceptors.response.use(response => {
  // 对响应数据做点什么
  return response.data
}, error => {
  // 对响应错误做点什么
  return Promise.reject(error)
})

4. 将封装好的axios实例导出，方便在项目中引用。

export default instance

在项目中使用封装好的axios请求，只需要导入该实例并调用相应的方法即可。

import axios from '@/utils/axios'

axios.get('/api/user').then(res => {
  console.log(res)
}).catch(err => {
  console.log(err)
})