你好,欢迎访问我的博客!登录
当前位置:首页 - springboot - 正文 求知成瘾,却无作品!

springboot axios 提交数据

2021-03-14springboot攻城狮387°c
A+ A-

简单记录前台使用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接收参数的两种方式。

未定义标签
推荐阅读

发表评论

必填

选填

选填

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。


  登录