1、出现的问题

最新做的一个新项目，使用了vue框架，ajax使用的则是vue官网推荐的axios，因为是第一次使用，用的时候axios发送数据时遇到后端接收不到数据的情况。

问题代码截图： 问题代码浏览器请求截图：

2、解决问题

因为当请求头Content-Type为text/plain;charset=UTF-8，请求参数在RequestPayload中，所以Tomcat后台没有接收到 所以需要设置请求头Content-Type为application/x-www-form-urlencoded （post请求时当Content-Type为application/x-www-form-urlencoded，参数是在Form Data请求体中）

具体区别查看：HTTP请求中的form data和request payload的区别

经过尝试知道是因为请求头的问题，但是因为axios是从promise库中剥离出来的，axios没有jquery里ajax那么好用，axios发送的参数需要进行转换，因为没有使用脚手架开发项目，所以无法使用npm库里的qs.stringify，但是写了一个方法弥补。

成功展示图

以下是代码

//axios axios({ method: "post", url: host + '/xpg/baoxian/getSpbxList', data: urlstringify({ "fl": title.trim(), "page": 1, "size": 10 }), headers: { "Content-Type": 'application/x-www-form-urlencoded' } }) .then(function (response) { } .catch(function (error) { console.log(error); }); //转义方法 function urlstringify(obj) {//字符串序列化 var str = ''; for (let key in obj) { if (Object.prototype.toString.call(obj[key]) === '[object Array]' || obj[key].constructor === Object) { //数组,对象 for (var arrKey in obj[key]) { if (Object.prototype.toString.call(obj[key][arrKey]) === '[object Array]' || obj[key][arrKey].constructor === Object) { //数组,对象 for (var arrarrKey in obj[key][arrKey]) { str += '&' + key + '[' + arrKey + '][' + arrarrKey + ']=' + obj[key][arrKey][arrarrKey]; } } else { //普通 str += '&' + key + '[' + arrKey + ']=' + obj[key][arrKey]; } } } else { //普通 str += '&' + key + '=' + obj[key]; } } return str.substring(1); }