axios的配置，get,post,axiso的同步问题解决
一.缘由
vue-resoure不更新维护，vue团队建议使用axios。
二.axios安装
1、利用npm安装npm install axios --save-dev
2、利用cnpm安装npm install axios --save //taobao源
3、利用bower安装bower install axios --save
4、 直接利用cdn引入<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
三.示例
1、 发送一个GET请求
//将请求参数挂载到请求的url中的形式
axios.get('/user?id=123&page=1').then(function(response){
console.log(response);//请求正确时执行的代码
}).catch(function (response){
console.log(response);//发生错误时执行的代码
}); //将请求参数单独的params属性传入的形式
axios.get('/user', {
params : { //请求参数
id : 123,
page:1
}
}).then(function(response){
console.log(response);//请求正确时执行的代码
}).catch(function(response){
console.log(response);//发生错误时执行的代码
});
2.发送一个post请求
axios({
method: "post",
url: "/api/history/query",
headers: {
"Content-Type": "application/json" //限制传输数据类型
},
data: {
"firstName": "Fred",
"lastName": "Flintstone"
} //传输的json数据
}).then(function(response){
console.log(response); //发生成功时执行的代码
}).catch(function(response){
console.log(response); //发生错误时执行的代码
})
3.一次并发多个请求
function getUserAccount(){
return axios.get('/user/12345');
}
function getUserPermissions(){
return axios.get('/user/12345/permissions');
}
axios.all([getUserAccount(),getUserPermissions()])
.then(axios.spread(function(getUserAccount,getUserPermissions){
console.log(getUserAccount)
console.log(getUserPermissions)
//getUserAccount是getUserAccount()成功后函数返回的值
//getUserPermissions是getUserPermissions()成功后函数返回的值
}));
四.axios的API
(1)axios可以通过配置（config）来发送请求
//发送一个"POST"请求
axios({
method:"POST",
url:"/user/123",
data:{
"first":"hello",
"last":"world"
}
})