vue怎么使用vue-resource发送ajax请求

VueResource简介

VueResource是Vue.js官方的HTTP客户端，相比于传统的XHR方式，VueResource更加简洁、易读、易用，并且与Vue.js的生命周期相结合，更容易实现前后端分离。

使用前的准备

在使用VueResource之前，需要先安装和引入。可直接使用VueCLI生成的模板中已包含，如果需要手动引入和安装，请执行以下命令：

1. npminstallvue-resource--save
2. importVueResourcefrom'vue-resource'
3. Vue.use(VueResource)

基本用法

使用VueResource发送AJAX请求十分简单，只需要在Vue实例中调用$http方法，即可实现发送请求，如下所示：

1. get请求：this.$http.get(url).then((response)=>{//处理响应});
2. post请求：this.$http.post(url,data).then((response)=>{//处理响应});
3. put请求：this.$http.put(url,data).then((response)=>{//处理响应});
4. delete请求：this.$http.delete(url).then((response)=>{//处理响应});

进阶用法

VueResource还提供了很多进阶用法，包括请求拦截、响应拦截、请求数据格式、响应数据格式等。以下是一些常用的进阶用法：

1. 请求拦截：

   this.$http.interceptors.request.use(config=>{//修改config参数returnconfig;},error=>{//处理请求错误returnPromise.reject(error);});

2. 响应拦截：

   this.$http.interceptors.response.use(response=>{//处理响应数据returnresponse;},error=>{//处理响应错误returnPromise.reject(error);});

3. 请求数据格式：

   this.$http.headers.post['Content-Type']='application/json';

4. 响应数据格式：

   this.$http.options.emulateJSON=true;//将响应数据转成表单格式this.$http.options.emulateHTTP=true;//开启PUT和DELETE请求的兼容模式