api.js

import axios from 'axios'

// http requser 拦截器
axios.interceptors.request.use((config) => {
    return config
}, (err) => {
    alert('请求超时')
    return Promise.resolve(err)
})

// 响应拦截， 异常处理
axios.interceptors.response.use((data) => {
    return data
}, (err) => {
    if (err && err.response) {
        switch (err.response.status) {
            case 400:
                alert('错误请求')
            break;
            case 401:
                alert('未授权，请重新登录')
                break;
            case 403:
                alert('拒绝访问')
                break;
            case 404:
                alert('请求错误,未找到该资源')
                break;
            case 405:
                alert('请求方法未允许')
                break;
            case 408:
                alert('请求超时')
                break;
            case 500:
                alertalert('服务器端出错')
                break;
            case 501:
                alert('网络未实现')
                break;
            case 502:
                alert('网络错误')
                break;
            case 503:
                alert('服务不可用')
                break;
            case 504:
                alert('网络超时')
                break;
            case 505:
                alert('http版本不支持该请求')
                break;
            default:
                alert(`连接错误${err.response.status}`)
        }
    } else {
        alert('服务器连接失败')
    }
})

/**
 *  封装 get 方法
 *  @returns { Promise }
 */

 export function get(url, params = {}) {
     return new Promise((resolve, rejects) => {
         axios.get(url, {
             params: params
         }).then((res) => {
             resolve(res.data)
         }).catch((err) => {
             rejects(err)
         })
     })
 }

 /**
  *  封装 post 方法
  *  @returns { Promise }
  */

  export function post(url, params ={}) {
      return new Promise((resolve, reject) => {
          axios.post(url, params).then((res) => {
              resolve(res.data)
          }).catch((err) => {
              reject(err)
          })
      })
  } 

  /**
   *  获取接口方法
   */

   export const server = {
       login (paramsObj) {
           return get('/login', paramsObj)
       }
   }

在main.js导入

// api 接口
import {server} from 'api/api'
// 添加 server 接口
Vue.prototype.$server = server

用法

const paramsObj = {
	username: 'admin',
	password: 123456
}

this.$server.login(paramsObj).then((res) => {
	console.log(res)
})