Vue axios发post请求后台接收不到参数的三种解决方案：

最近用vue做项目使用axios发送post请求时遇到了前端传数据后端接收不到的情况：

代码：

image.png

后来仔细对比ajax发现axios传值是这样的：

image.png

而ajax传值是这样的：

image.png

一个Request Payload，一个Form Data。
将Request Payload 转为Form Data格式就可以了，有三种方式：

一、使用qs（推荐）

首先在你的项目里安装qs模块：

npm install qs --save-dev

然后在需要使用的页面引入一下：

import qs from 'qs'

引入好了之后，把上面的postData用qs转一下再发送给后台就可以了：

let postData = qs.stringify({
        certificationAccount: that.certificationAccount,
        balance: that.balance
})

这样发送给后台时就是Format Data格式了。

二、使用URLSearchParams

let postData= new URLSearchParams()
postData.append('certificationAccount',  that.certificationAccount)
postData.append('balance',  that.balance)

这样也可以，个人觉得写起来麻烦。

三、直接使用字符串

let postData ='certificationAccount =' + that.certificationAccount + '&balance=' + that.balance

es6写法：

let postData = `
          certificationAccount = ${that.certificationAccount}&balance=${that.balance}
`

三种方法的原理是一样一样的，都是转化为字符串，但第三种方法当所传的值为null时会被转化为空字符串，个人推荐的是第一种方法。