学做蛋糕哪个网站好,免费编程网课,自己做网站原始代码,网站建设需求说明目录 前言1. 注解用法1.1 方法参数1.2 方法1.3 类 2. 注解场景2.1 表单参数2.2 AJAX请求2.3 文件上传 3. 实战4. 总结 前言
将请求参数绑定到模型对象上#xff0c;或者在请求处理之前添加模型属性
可以在方法参数、方法或者类上使用
一般适用这几种场景#xff1a;
表单… 目录 前言1. 注解用法1.1 方法参数1.2 方法1.3 类 2. 注解场景2.1 表单参数2.2 AJAX请求2.3 文件上传 3. 实战4. 总结 前言
将请求参数绑定到模型对象上或者在请求处理之前添加模型属性
可以在方法参数、方法或者类上使用
一般适用这几种场景
表单处理通过 ModelAttribute 将表单数据绑定到模型对象上预处理逻辑在请求处理之前执行一些初始化操作如设置常见模型属性RESTful API结合 RequestBody 处理 JSON 数据
对于Java的相关知识推荐阅读java框架 零基础从入门到精通的学习路线 附开源项目面经等超全
1. 注解用法
1.1 方法参数
将表单参数name 和 email绑定到 User 对象上并将这个对象作为模型属性传递给视图
后端结合User对应这个User属性要写全才能获取到对应属性
Controller
public class UserController {RequestMapping(value /user, method RequestMethod.POST)public String addUser(ModelAttribute User user, Model model) {// 处理业务逻辑model.addAttribute(user, user);return userDetails;}
}前端对应捕捉相关的表单值
form action/user methodpostinput typetext namename /input typetext nameemail /button typesubmitSubmit/button
/form1.2 方法
控制器方法上使用 ModelAttribute 注解可以在每个请求处理方法调用之前执行一些预处理操作如初始化模型数据
对应的后端示例如下
Controller
public class UserController {ModelAttributepublic void addAttributes(Model model) {model.addAttribute(message, Welcome to the user page!);}RequestMapping(value /user, method RequestMethod.GET)public String getUserForm(Model model) {// 模型中已经包含了 message 属性return userForm;}
}前端视图如下
!-- userForm.jsp --
html
bodyh1${message}/h1form action/user methodpostinput typetext namename /input typetext nameemail /button typesubmitSubmit/button/form
/body
/html对应每次请求都会在控制器方法调用之前添加一个名为 message 的模型属性
1.3 类
在类上使用 ModelAttribute 注解可以为所有该类的请求处理方法添加共同的模型属性
对应后端写法如下
Controller
SessionAttributes(user)
public class UserController {ModelAttribute(user)public User createUser() {return new User();}RequestMapping(value /user, method RequestMethod.GET)public String getUserForm(ModelAttribute(user) User user) {return userForm;}RequestMapping(value /user, method RequestMethod.POST)public String submitUser(ModelAttribute(user) User user) {// 处理业务逻辑return userDetails;}
}2. 注解场景
与上面的第一章有些重复不过容易理解
2.1 表单参数
表单参数处理来自前端 HTML 表单的数据将表单字段绑定到 Java 对象上 其Demo对应此章的1.1
也可通过编辑用户信息绑定到相关的模型对象
Controller
public class UserController {RequestMapping(value /user/edit, method RequestMethod.GET)public String editUser(ModelAttribute User user, RequestParam(userId) Long userId, Model model) {// 通过 userId 获取用户信息并填充到 user 对象user userService.findById(userId);model.addAttribute(user, user);return editUserForm;}
}2.2 AJAX请求
配合前端进行交互此处写一个示例的Demo
使用 JavaScript例如 jQuery 或者原生的 XMLHttpRequest发送异步请求后端通过 RequestBody 结合 ModelAttribute 解析 JSON 数据
$.ajax({url: /user,type: POST,contentType: application/json,data: JSON.stringify({ name: John, email: johnexample.com }),success: function(response) {console.log(response);}
});对应后端如下
Controller
public class UserController {RequestMapping(value /user, method RequestMethod.POST)ResponseBodypublic User addUser(RequestBody ModelAttribute User user) {// 处理业务逻辑return user;}
}2.3 文件上传
前端使用 form 标签并设置 enctypemultipart/form-data后端通过 ModelAttribute 绑定文件数据
前端
form action/upload methodpost enctypemultipart/form-datainput typefile namefile /button typesubmitUpload/button
/form后端
Controller
public class FileUploadController {RequestMapping(value /upload, method RequestMethod.POST)public String handleFileUpload(RequestParam(file) MultipartFile file) {// 处理文件上传逻辑return fileUploadSuccess;}
}3. 实战
通过实战前端交互加深印象
此处使用Vue3 Java
对应的函数调用如下
options中添加了file的对应属性但是后续需要将id传输给后端
对应的JS如下
// 上传文件
export const updateFile (data: any) {const formData new FormData();formData.append(file, data.file);formData.append(appointmentId, data.id.toString());return request.upload({url: /dangerous/appointment-commission/appointment-file/upload,data: formData});
}其后端的写法如下
PostMapping(/appointment-file/upload)
Operation(summary 上传文件, description 模式一后端上传文件)
public CommonResultString uploadFile(ModelAttribute FileUploadReqVO uploadReqVO,RequestParam(appointmentId) Long appointmentId) throws Exception {MultipartFile file uploadReqVO.getFile();String path uploadReqVO.getPath();return success(appointmentCommissionService.createFile(file.getOriginalFilename(), path, IoUtil.readBytes(file.getInputStream()),appointmentId));
}4. 总结
RequestBody数据来自请求体通常是 JSON 格式
Controller
public class UserController {RequestMapping(value /api/user, method RequestMethod.POST)ResponseBodypublic User addUser(RequestBody User user) {// 处理 JSON 请求体return user;}
}ModelAttribute数据来自 URL 查询参数、表单参数或其他请求参数
Controller
public class UserController {RequestMapping(value /form/user, method RequestMethod.POST)public String addUser(ModelAttribute User user) {// 处理表单参数return userDetails;}
}其他注解详情如下
注解说明ModelAttribute适用于将多个请求参数绑定到复杂对象或在处理请求之前初始化模型数据RequestParam适用于获取单个或少量请求参数RequestBody适用于处理 JSON 格式的请求体数据PathVariable适用于从 RESTful 风格的 URL 中提取路径变量RequestHeader适用于访问 HTTP 请求头信息CookieValue适用于从请求中获取特定的 Cookie 值