vue中使用axios时Form Data和Request Payload,以及From Data中数据是一行字符串问题?

Request Payload 格式数据,axios默认的Content-type是application/json;charset=UTF-8,后端用request.getParameter()根本接收不到
vue中使用axios时Form Data和Request Payload,以及From Data中数据是一行字符串问题?_第1张图片
设置请求格式为表单{headers: {'content-type': 'application/x-www-form-urlencoded'}}

sendAjax: function() {

				var data = {};
				data.no = "001";
				data.name = "李四";
				data.comment = "admin";
				var that = this;


				axios.post("CommentServlet",data, {headers: {'content-type': 'application/x-www-form-urlencoded'}}).then(function(result) {
					console.log(result);
				});
				console.log(data);
			}

修改完之后就成了表单格式了,但还有问题,这个表单将json格式整体作为了字符串,相当于整体是一个键,而没有值,所以后台接收不到,是null。
vue中使用axios时Form Data和Request Payload,以及From Data中数据是一行字符串问题?_第2张图片
解决方法:

  • 1.导包,axios内置的不用下载。
import qs from 'qs';
  • 2.qs.stringify()
sendAjax: function() {

				var data = {};
				data.no = "001";
				data.name = "李四";
				data.comment = "admin";
				var that = this;


				axios.post("CommentServlet", qs.stringify(data, {headers: {'content-type': 'application/x-www-form-urlencoded'}
				})).then(function(result) {
					console.log(result);
				});
				console.log(data);
			}

结果:
vue中使用axios时Form Data和Request Payload,以及From Data中数据是一行字符串问题?_第3张图片
后端可以接收数据

String comment = request.getParameter("comment");
String name = request.getParameter("name");
String no = request.getParameter("no");

谢谢!

你可能感兴趣的:(前端)