React使用axios的post方式和后端进行数据交互

一、

以下的例子是通过Antd的Form表单提交数据，和后台进行数据交互。

该方法通过axios的post方法，将value通过定义好的接口传递给后台，并获得响应体。

<Form {...layout} name="nest-messages" onFinish={onFinish} validateMessages={validateMessages}> const onFinish = values => { console.log("values: ", values); axios.post('http://localhost:8089/dormitory/dormsave', values) .then(function (response) { console.log("response: ", response); }) .catch(err => console.log(err)) };

此处注意传递的数据默认为String的Map，后台可通过以下方式获得其想要的参数。 @RequestBody Map<String,String> data

@CrossOrigin(origins = "*",maxAge = 3600) @RequestMapping("/dormsave") @ResponseBody public String dormsave(@RequestBody Map<String,String> data){ System.out.println("save!!!!!!"+data); Dorm dorm = new Dorm(); dorm.setD_id(Integer.parseInt(data.get("d_id"))); dorm.setTotal(Integer.parseInt(data.get("total"))); dorm.setUsed(Integer.parseInt(data.get("used"))); dorm.setDormadmin(data.get("dormadmin")); }