从vue2.0版本开始,HTTP请求工具官方不再推荐vue-resource,而开始推荐axios。axios是一个基于Promise的HTTP请求客户端,用来发送请求,Promise是基于es6对象的概念。在用法上,vue-resource与axios两者有一此差别,在使用的时候我们加一点注意。
vue只关注视图层
1.以PHP为例,首先需要引入,我们使用CDN,地址是<script src=";></script>。
2.axios支持的请求方法有如下几种:
axios.request(config)
axios.get(url[, config])
axios.delete(url[, config])
axios.head(url[, config])
axios.post(url[, data[, config]])
axios.put(url[, data[, config]])
axios.patch(url[, data[, config]])
3.以get为例,在使用vue-resource时,我们的方法是:
new Vue({
el:"#app",
methods:{
get:function(){
this.$(url,{
Params:{ }
}).then(function(){
.............
},function(){
.............
}
}
})
现在,我们只要改成:
new Vue({
el:"#app",
methods:{
get:function(){
axios.get(url,{
params:{ }
}).then(
response => {
.............
},response => {
.................
});
}
}
})
以上粗体的部分,就是与以前的用法不同的部分。可以看出,
1.axios.get代替了this.$。
2.response=>代替了function(res){......}
3.get方法中交互的数据要用params进行传参,当然这是vue1.0中的知识,到vue2.0的axios时,依然适用。
4.POST方式传递参数有两种方式,一种是普通的formd方式,一种是json方式。formd方式注意用Params处理一下接口。在php后端,如果是formd传来的数据,用post方式接收,如果是json格式,需要用file_get_contents('php://input')来接收数据,当然你还可以用fopen或curl函数。这里就不再赘述。