springboot axios 提交数据

简单记录前台使用axios提交数据至springboot后台时的技巧：

以新增人员(Person)为例，主要记录两种接收值的方式，

Person类：

public class Person{
    private String name;
    private String address;
    //...此处省略get set方法
}

第一种：

public Object addPerson(Person person){}

这种的是希望自动将参数组装为对应是实体类，这里就要求axios发送的数据的键与Person对象的属性名一致。

对应的axios：

axios({
	method: 'post',
	url:'springboot后台请求地址',
	data: serialize({
		name:'小明',
		address:'测试地址'}),
	headers: {
		'X-Requested-With': 'XMLHttpRequest',
		'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
	}
}).then(rep=>{
	//后续操作
}).catch(err=>{
	//异常后续操作
});

//序列化函数
serialize(data){
	let list = [];
	Object.keys(data).forEach(ele => {
		if((typeof data[ele])==="object"){
			list.push(`${ele}=${JSON.stringify(data[ele])}`);
		}else{
			list.push(`${ele}=${data[ele]}`);
		}
	})
	return list.join('&');
}

第二种：

public Object addPerson(String name,String address){}

这种的是希望以单个参数的方式接收前台传递的参数，与springmvc比较相似，这里要求axios发送的参数名与后台方法的形参名称一致。

对应的axios：

axios({
	method: 'post',
	url:'springboot后台请求地址',
	data: {'name':'小明','address':'测试地址'},
}).then(rep=>{
	//后续操作
}).catch(err=>{
	//后续错误处理
})

以上就是不同的两种axios请求和java接收参数的两种方式。