利用axios向后端传递数据

最新推荐文章于 2024-08-23 09:23:56 发布

@一株木棉

最新推荐文章于 2024-08-23 09:23:56 发布

阅读量1.2w

点赞数 10

分类专栏：前端文章标签： vue ajax

本文链接：https://blog.csdn.net/weixin_42634517/article/details/119410806

版权

前端专栏收录该内容

1 篇文章 0 订阅

订阅专栏

本文介绍了如何使用axios进行前后端数据交换，包括利用data进行实体类参数传递（需引入Jackson依赖），params方式处理字符串参数，以及get请求的参数传递。着重展示了POST请求中json格式的数据转换和后端@RequestBody注解的使用。

摘要由CSDN通过智能技术生成

利用axios向后端传递数据

1.利用data传递参数，后端需要用实体类接受，参数在请求体里面，因此只能用post请求
前端代码

 axios({
                            url:"/book/user/login",
                            method:"post",
                            contentType:"application/json",
                            data:{
                                username:this.ruleForm.username,
                                password:this.ruleForm.pass
                            }
                        }).then(function (response) {
                            alert(response.data);
                        });

后端代码，需要用@RequestBody 注释

@Controller
@RequestMapping("/user")
public class UserController {

    @RequestMapping("/login")
    @ResponseBody
    public String login(@RequestBody User user) {
        System.out.println(user);
        return "success";
    }

}

在这里插入图片描述

注意事项，使用这种方法需要导入jackson依赖

    <dependency>
        <groupId>com.fasterxml.jackson.core</groupId>
        <artifactId>jackson-databind</artifactId>
        <version>2.12.3</version>
    </dependency>

2.利用params传递参数

 axios({
                            url:"/book/user/login",
                            method:"post",
                            contentType:"application/json",
                            params:{
                                username:this.ruleForm.username,
                                password:this.ruleForm.pass
                            }
                        }).then(function (response) {
                            alert(response.data);
                        });

后端用字符串参数接受

@Controller
@RequestMapping("/user")
public class UserController {

    @RequestMapping("/login")
    @ResponseBody
    public String login(String username,String password) {
        System.out.println(username+password);
        return "success";
    }

}