vue中axios封装

js文件中

import axios from ‘axios‘
//url data={} get/post
import configs from ‘./configs.js‘
export default(url,data={},method=‘GET‘)=>{
return new Promise((resolve,reject)=>{
axios({
url:configs.host+url,
data,
method,
//header{}
}).then(resphonse=>{
console.log(‘成功‘,resphonse)
resolve(resphonse)
}).catch(error=>{
console.log(‘失败‘,error)
reject(error)
})
})
}

Index.vue中

import router from ‘./router.js‘
import request from ‘./axios封装.js‘
export default {
router,
methods: {
async banners() {
let bannerListData = await request(‘/banner‘)
console.log(bannerListData.data)
}

},
mounted() {
this.banners()
}
}

如果重复使用一个路径http://localhost:3000，那就写一个js文件来暴露它

configs.js中

export default{
host:"http://localhost:3000"
}

vue中axios封装

原文：https://www.cnblogs.com/hgyyy/p/14857598.html