今天给大家写一篇关于ajax在vue中的应用及封装，有些同学可能会有疑问，因为熟悉vue的都知道，vue中有vue-resource和axios是专门用于http交互的，那么ajax岂不是多此一举吗？其实不然，ajax有ajax的优势，并且小编本身对ajax有着特殊的感情，今天就给大家详细详解ajax在vue中的应用。

首先我们有必要配置一下jQuery，具体配置方法很简单，教程如下：

1.安装jquery npm install jquery --save-dev 2.build/webpack.base.conf.js中， 导入：var webpack = require('webpack'); 最下面添加： plugins: [ new webpack.ProvidePlugin({ $:"jquery", jQuery:"jquery", "window.jQuery":"jquery" }) ]

如果你还未能配置好jquery的话，可以百度查找最新的教程解决问题，当然，配置jquery也是因为配合使用ajax，接下来我们需要新建一个js文件，存放的位置如下，当然也可以跟我的位置不同，随意

我们新建一个请求http的方法，叫postvoid

var common = {    postvoid(url, data, cellback) {    var token = xxxxxx;    var username = xxxxxxx;    $.ajax({      type: "POST",      url: this.res_url + url,      data: data,      async: true,      headers: {        "token": token,        "username": username      },      success: function (res) {        cellback(res)      },      error: function () {        alert("网络错误")      }    })  }    }

module.exports = common

下面我们看一下如何调用这个文件这个方法

首先我们在test.vue文件中导入http.js文件，并把结果赋给变量g，方便调用

g.post_func("/api/v1/xxx", req_data, function(data) {        console.log(data);      });

调用起来就很简单了，把参数传进去，打印data就可以了