vuebase-10_Axios配置
1.全局配置
axios.defaults.baseURL = 'https://api.example.com';
axios.defaults.headers.common['Authorization'] = AUTH_TOKEN;
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
2.拦截器
// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import App from './App'
import Axios from 'axios'
import qs from "qs"// 解决参数格式的转码问题 ?name=iwen&age=20 {name:iwen,age:20}
Vue.prototype.$axios=Axios
axios.defaults.baseURL = 'https://api.example.com';
axios.defaults.headers.common['Authorization'] = AUTH_TOKEN;
//axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
//拦截器
// 添加请求拦截器
axios.interceptors.request.use(function (config) {
// 在发送请求之前做些什么
if(config.method=="post"){
config.data=qs.stringify(config.data)
}
return config;
}, function (error) {
// 对请求错误做些什么
return Promise.reject(error);
});
// 添加响应拦截器
axios.interceptors.response.use(function (response) {
// 对响应数据做点什么
if(!response.data){
return{
"msg":"数据没有成功返回"
}
}
return response;
}, function (error) {
// 对响应错误做点什么
return Promise.reject(error);
});
Vue.config.productionTip = false
//自定义指令
Vue.directive("focus",{
//当前的生命周期
inserted:function(el,binding){
console.log(el);
console.log(binding)
el.focus();
},
bind:function(el){
console.log("只执行一次钩子函数")
},
update:function(el){
console.log("更新")
}
})
/* eslint-disable no-new */
new Vue({
el: '#app',
data:{msg:"vue.root"},
components: { App },
template: '<App/>'
})