HTML date类型数前后端互传,页面显示date类型

springMVC+thymeleaf+HTML(date)

1.实体类定义字段为date类型

bash 复制代码
private Date bizdate;

2.前端HTML中input的date类型

bash 复制代码
<div class="form-group">
            <label for="bizdate">请输入交易日期</label>
            <input type="date" class="form-control" id="bizdate" placeholder="name" name="bizdate">
        </div>

3.前端提交到后端用实体类接收时,实体类中的字段要加@DateTimeFormat(pattern = "yyyy-MM-dd")

bash 复制代码
@DateTimeFormat(pattern = "yyyy-MM-dd")
    private Date bizdate;

4.后端查出来数据赋值给前端时,添加th:value="${#dates.format(incomeDetail.bizdate, 'yyyy-MM-dd')}"

bash 复制代码
input中如下
<div class="form-group">
    <label for="bizdate">请输入交易日期</label>
    <input type="date" class="form-control" id="bizdate" placeholder="name" name="bizdate" th:value="${#dates.format(incomeDetail.bizdate, 'yyyy-MM-dd')}">
  </div>
列表中如下:
<td th:text="${#dates.format(incomeDetail.bizdate, 'yyyy-MM-dd')}"></td>
相关推荐
这里有鱼汤23 分钟前
Python 的 bisect 模块:这个冷门宝藏你用对了吗?
前端·后端·python
博览鸿蒙23 分钟前
FPGA设计职位介绍|如何成为一名合格的数字前端设计工程师?
前端·fpga开发
老胡说前端25 分钟前
JS 数组相同的key 进行合并
前端·javascript·vue.js
kovlistudio32 分钟前
红宝书第三十二讲:零基础学会模块打包器:Webpack、Parcel、Rollup
前端·javascript·webpack·node.js
这里有鱼汤35 分钟前
Python 跨平台路径处理:最优解来了!
前端·后端·python
SailingCoder36 分钟前
npm ERR! CXX(target) Release/obj.target/deasync/src/deasync.o
前端·npm·node.js
念九_ysl1 小时前
使用 Vue 快速集成 FullCalendar 日历组件教程
前端·javascript·vue.js
造夢先森1 小时前
SpringAI+MCP协议 实战
前端·javascript·easyui
恋猫de小郭2 小时前
你为什么需要了解 Dart AST?一个简单的 bug 带你快速认识下 Dart Kernel AST
android·前端·flutter
excel2 小时前
webpack 格式化模块 第 二 节
前端