Axios post请求

//前端页面


<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Axios的post请求方式</title>
    <!--引入axios的相关依赖-->
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>
<body>
<input type="text" id="tx" placeholder="这是map的value值" title="这是map的value值">
</body>
<script>
    //post请求
    //axios的post请求传递参数的两种方式
    //第一种使用字符串进行参数传递："name='刘诗诗'&age=38"
    //第二种方式后端接口直接使用@RequestBody注解形式接收参数 前端使用{name:刘诗诗,age:18}进行传参
    axios.post("http://127.0.0.1:8083/LQ/axios/save","name=刘诗诗&age=18")
        .then(function (response) {
            console.log(response.data)
            console.log(response.data['success'])
            console.log(response.data['message'])

            var success = response.data['success']
            document.getElementById("tx").value = success //通过获取id元素把response.data取得值附加到text文本框


        }).catch(function (err) {
        console.log(err)
    })
</script>
</html>

//后端代码

@PostMapping("save")
@CrossOrigin//跨域
public Map<String,Object> save(String name,Integer age){
    System.out.println("name ="+name);
    System.out.println("age="+age);
    Map<String, Object> map=new HashMap<>();
    map.put("success",true);
    map.put("message","保存成功");
    return  map;
}