@PostMapping方法检查@Valid后，Thymeleaf th:if...th:errors不在页面中显示错误消息

在前端开发中，Thymeleaf是一款服务器端的Java模板引擎，用于将数据动态渲染到HTML页面中。在使用Thymeleaf进行表单验证时，可以通过使用th:if和th:errors来控制是否在页面中显示错误消息。

首先，确保在后端的控制器方法上使用了@PostMapping注解来处理表单的提交请求，并在参数上添加了@Valid注解进行数据的验证。

@PostMapping("/submit")
public String submitForm(@Valid FormDTO form, BindingResult bindingResult, Model model) {
    if (bindingResult.hasErrors()) {
        // 表单验证失败，将错误信息传递到前端页面
        model.addAttribute("errors", bindingResult.getAllErrors());
    }
    // 处理表单提交逻辑
    // ...
    return "result";
}

在上述代码中，FormDTO是表单对应的数据传输对象，BindingResult用于接收验证结果，Model用于传递数据到前端页面。

接下来，在前端的HTML页面中使用Thymeleaf的th:if和th:errors来判断是否显示错误消息。

<form action="/submit" method="post" th:object="${form}">
    <div>
        <label for="name">Name:</label>
        <input type="text" id="name" th:field="*{name}" />
        <span th:if="${#fields.hasErrors('name')}" th:errors="*{name}"></span>
    </div>
    <!-- 其他表单项 -->
    <button type="submit">Submit</button>
</form>

在上述代码中，th:if="${#fields.hasErrors('name')}"用于判断name字段是否有错误，如果有错误则显示错误消息，th:errors="*{name}"用于展示name字段的错误消息。

优势：