在刚结束的项目中对axios进行了实践（好不容易碰上一个不是jsonp的项目），
以下为在项目中对axios的封装，仅封装了post方法，因为项目中只用到了post，如有需要请自行进行修改
src/config.js
//api接口前缀
export const apiBaseUrl = 'http://xxx.xxx.xxx.xxx:8888/test/'
src/axios.js
import axios from 'axios'
import qs from 'qs'
import { apiBaseUrl } from './config.js' //请求拦截器
axios.interceptors.request.use(function (param) {
return param
}, function (error) {
// 请求错误
return Promise.reject(error)
}) // 添加响应拦截器
axios.interceptors.response.use(function (response) {
return response.data
}, function (error) {
// 响应错误
return Promise.reject(error)
}) // 封装axios--------------------------------------------------------------------------------------
function apiAxios(url, params) {
let httpDefault = {
method: "POST",
baseURL: apiBaseUrl,
url: url,
data: qs.stringify(params),
} return new Promise((resolve, reject) => {
axios(httpDefault)
// 此处的.then属于axios
.then((res) => {
resolve(res)
}).catch((response) => {
reject(response)
})
})
} export default {
install: function (Vue) {
Vue.prototype.$axios = (url, params) => apiAxios(url, params)
}
}
src/main.js
import axios from "@/axios.js" Vue.use(axios)