Vue简单封装Axios

/*
 * @Author: lzx
 * @Date: 2021-10-12 13:12:08
 * @LastEditors: lzx
 * @LastEditTime: 2021-10-12 14:20:44
 * @Description: Fuck Bug
 * @FilePath: \xsy-auth\src\util\api.js
 */
// 引入axios
import axios from 'axios'

// axios.defaults.baseURL = 'http://127.0.0.1:8000' // 设置请求后端的URL地址
axios.defaults.timeout = 2000 // axios请求超时时间
// // 头部携带token
axios.defaults.headers.common.token = sessionStorage.getItem('token')

// get请求
const get = (url, param) => {
  return new Promise((resolve, reject) => {
    axios.get(url, { param }).then(res => {
      resolve(res.data)
    }).catch(err => {
      reject(err.data)
    })
  })
}
// put请求
const put = (url, data) => {
  return new Promise((resolve, reject) => {
    axios.put(url, data).then(res => {
      resolve(res.data)
    }).catch(err => {
      reject(err.data)
    })
  })
}
// delete请求
const del = (url, data) => {
  return new Promise((resolve, reject) => {
    axios.delete(url, data).then(res => {
      resolve(res.data)
    }).catch(err => {
      reject(err.data)
    })
  })
}
// post请求
const post = (url, data) => {
  return new Promise((resolve, reject) => {
    axios.post(url, data).then(res => {
      resolve(res.data)
    }).catch(err => {
      reject(err.data)
    })
  })
}

export {
  get,
  put,
  del,
  post
}

// 引入封装的Axios
import { get, put, del, post } from './util/api.js'
// 使用封装的Axios
Vue.prototype.$get = get
Vue.prototype.$put = put
Vue.prototype.$delete = del
Vue.prototype.$post = post

// 1、get请求
thi.$get('url').then(res => {
  console.log(res.data)
})
// 2、put请求
this.$put('url', {有携带 | 没有可以直接如下}).then(res => {
  console.log(res.data)
})
this.$put('url').then(res => {
  console.log(res.data)
})
//this.$delete...如上
//this.$post...如上