1.引入axios模块
import axios from 'axios'
2.创建一个axios实例对象(对象中包含get和post方法)
let service = axios.create({
baseURL:'http://localhost:3000/admin' ,
timeout: 5000 // 请求超时时间
})
3.requset拦截器
service.interceptors.request.use(config => {
//判断是否存在token
if(localStoreage.token){
//设置统一的请求header
config.header.Authoriation=localStorage.token
}
return config
}, error => {
Promise.reject(error)
})
4.reponse拦截器
service.interceptors.response.use(res => {
//在响应前做的事情
if (res.data.code == 666) {
return res.data
} else {
return Promise.reject(res.data.msg);
}
},
error => {
return Promise.reject(error)
});
5.将创建的axios对象挂载在Vue原型上
//main.js
import $axios from '../src/utils/requset'
Vue.prototype.$axios = $axios;
6.调用axios的实例
let url = "/city/getList";
this.$axios
.get(url)
.then(res => {
this.list = res.cities;
console.log(res.cities);
})
.catch(err => {
console.log(err);
});