--- vue-resourse和axios区别：
用法：它其实就是我们vue请求里面的 this.$http.*** 和 this.axios.***
功能特性：
*** vue-axios
vue2.0之后，就不再对vue-resource更新，而是推荐使用axios。基于 Promise 的 HTTP 请求客户端，可同时在浏览器和 Node.js 中使用。
功能特性
1、在浏览器中发送 XMLHttpRequests 请求
2、在 node.js 中发送 http请求
3、支持 Promise API
4、拦截请求和响应
5、转换请求和响应数据
6、取消请求
7、自动转换 JSON 数据
8、客户端支持保护安全免受 CSRF/XSRF 攻击
*** vue-resource
vue-resource是Vue.js的一款插件，它可以通过XMLHttpRequest或JSONP发起请求并处理响应。也就是说，jquery的 $.ajax 能做的事情，vue-resource一样也能做到，而且vue-resource的API更为简洁。另外，vue-resource还提供了非常有用的inteceptor功能，使用inteceptor可以在请求前和请求后附加一些行为，比如使用inteceptor在ajax请求时显示loading界面。
1、体积小
vue-resource非常小巧，在压缩以后只有大约12KB，服务端启用gzip压缩后只有4.5KB大小，这远比
jQuery的体积要小得多。
2、支持主流的浏览器
和Vue.js一样，vue-resource除了不支持IE 9以下的浏览器，其他主流的浏览器都支持。
3、支持Promise API和URI Templates
Promise是ES6的特性，Promise的中文含义为“先知”，Promise对象用于异步计算。
URI Templates表示URI模板，有些类似于ASP.NET MVC的路由模板。
4、支持拦截器
拦截器是全局的，拦截器可以在请求发送前和发送请求后做一些处理。拦截器在一些场景下会非常有用，
比如请求发送前在headers中设置access_token，或者在请求失败时，提供共通的处理方式。
具体用法：
--- axios
基于 Promise 的 HTTP 请求客户端，可同时在浏览器和 Node.js 中使用。--- 安装 axios
npm install axios--- 在要使用的文件中引入axios
import axios from 'axios'--- GET请求
// 向具有指定ID用户发出请求
// 向具有指定ID的用户发出请求
axios.get('/user?ID=12345').then(function (response) {
console.log(response);
}).catch(function (error) {
console.log(error);
});// 通过params对象传递参数
// 也可以通过 params 对象传递参数
axios.get('/user', {
params: {
ID: 12345
}
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});--- POST请求
axios.post('/user', {
firstName: 'Fred',
lastName: 'Flintstone'
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});--- 执行多个并发请求
function getUserAccount() {
return axios.get('/user/12345');
}
function getUserPermissions() {
return axios.get('/user/12345/permissions');
}
axios.all([getUserAccount(), getUserPermissions()])
.then(axios.spread(function (acct, perms) {
//两个请求现已完成
}));--- vue-resourse
Vue.js是数据驱动的，这使得我们并不需要直接操作DOM，
如果我们不需要使用jQuery的DOM选择器，就没有必要引入jQuery。
vue-resource是Vue.js的一款插件，它可以通过XMLHttpRequest或JSONP发起请求并处理响应。
也就是说，$.ajax能做的事情，vue-resource插件一样也能做到，而且vue-resource的API更为简洁。
另外，vue-resource还提供了非常有用的inteceptor(监示器)功能，
使用inteceptor可以在请求前和请求后附加一些行为，
比如使用inteceptor在ajax请求时显示loading界面。
-- vue-resource特点
vue-resource插件具有以下特点：
1.体积小
vue-resource非常小巧，在压缩以后只有大约12KB，服务端启用gzip压缩后只有4.5KB大小，这远比jQuery的体积要小得多。
2.支持主流的浏览器
和Vue.js一样，vue-resource除了不支持IE 9以下的浏览器，其他主流的浏览器都支持。
3.支持Promise API和URI Templates
Promise是ES6的特性，Promise的中文含义为“先知”，Promise对象用于异步计算。
URI Templates表示URI模板，有些类似于ASP.NET MVC的路由模板。
4.支持拦截器
拦截器是全局的，拦截器可以在请求发送前和发送请求后做一些处理。
拦截器在一些场景下会非常有用，比如请求发送前在headers中设置access_token，或者在请求失败时，提供共通的处理方式。
-- vue-resource使用
1.安装vue-resourse
输入：npm install vue-resource --save
2.在main.js中导入，如下所示：
import VueResource from 'vue-resource'
Vue.use(VueResource)
3.组件中就可以使用了：
--- get请求
var params = {params: {id: id}}
this.$http.get(url, params).then(function(res){
// 响应成功回调
var data = res.body;
//数据在res.body里面
}, function(res){
// 响应错误回调
});
--- post请求
//启用{emulateJSON : true}选项后，
请求会以application/x-www-form-urlencoded作为content-type,像HTML表单一样。
var params = {params: {id: id}}
this.$http.post(url, params,{emulateJSON : true}).then(function(res){
// 响应成功回调
var data = res.body;
//数据在res.body里面
}, function(res){
// 响应错误回调
}
--- JSONP 请求
var JSONparams ={
params: {id: id}
jsonp: 'callback' // 设置回调函数的参数的一个名字，默认是话是callback,
}
this.$http.jsonp(url, JSONparams).then( (res) => {
console.log(res);
}, (err) => {
console.log(err);
})
