axios delete传参_axios异步查询工具

前端异步查询工具axios

异步查询数据，自然是通过ajax查询，大家首先想起的肯定是jQuery。但jQuery与MVVM的思想不吻合，而且ajax只是jQuery的一小部分。

因此不可能为了发起ajax请求而去引用这么大的一个库。Vue官方推荐的ajax请求框架叫做：axios

axios的Get请求语法：

axios

axios的POST请求语法：

比如新增一个用户

axios

注意，POST请求传参，不需要像GET请求那样定义一个对象，在对象的params参数中传参。post()方法的第二个参数对象，就是将来要传递的参数。

PUT和DELETE请求与POST请求类似

我们这里的使用是在：

getDataFromServer

我们这里没有使用axios而是使用了this.$http，因为我们在src/http.js中做了封装：

// 将axios添加到 Vue的原型，这样一切vue实例都可以使用该对象

使用后返回的响应数据为：

axios​www.npmjs.com

json对象转换为查询字符串

请求的数据格式是一个JSON对象，在controller中只能使用一个对象接收，不能使用两个参数接收，否则报400错误。

axios处理请求体的原则会根据请求数据的格式来定：

如果请求体是对象：会转为json发送

如果请求体是String：会作为普通表单请求发送，但需要我们自己保证String的格式是键值对。如：name=jack&age=12

可以使用QS工具，在前端将json数据转换为请求参数字符串

QS是一个第三方库，我们可以用 npm install qs --save 来安装。

QS，即Query String，请求参数字符串。例如： name=jack&age=21

QS工具可以便捷的实现 JS的Object与QueryString的转换。

data: this.$qs.stringify(params)

parse()方法可以将查询字符串转换为json对象