前端修改功能日期无法获取展示

这是我最原始的代码，由于日期没有进行转型。所以我th:value="${apple.date}"中获取的值是Mon Apr 12 00:00:00 CST 2021这个样子的。

updUser.html:

<label class="layui-form-label">日期</label>
    <div class="layui-input-block">
        <input type="date" name="date" th:value="${apple.date}" required  lay-verify="required" placeholder="日期" autocomplete="off" class="layui-input">
    </div>

而实际上可以看到我修改页面中，日期设置的是yyyy-MM-dd这个格式的。所以当点击修改跳转修改页面的时候，这个地方是获取到值了但是无法展示。我们来做个实验看看

我将type改为文本类型看是否能获取到值如果能获取的是什么类型的值，同时再尝试能否将获取日期的值转型为yyyy-MM-dd格式，并以text文本格式输出到下面。

updUser.html

<label class="layui-form-label">日期</label>
    <div class="layui-input-block">
        <input type="text" th:text="${#dates.format(apple.date, 'yyyy-MM-dd')}" name="date" th:value="${apple.date}" required  lay-verify="required" placeholder="日期" autocomplete="off" class="layui-input">
    </div>

如下图可以看到，我们之前默认获取到的值是Mon Apr 12 00:00:00 CST 2021（Wed Apr 07 00:00:00 CST 2021）这个格式的，但是我们日期规定了date是yyyy-MM-dd（2021-04-07）这种格式。所以需要进行转型date才能正常输出前台获取到的date日期的值。

修改完之后的代码：

updUser.html

<label class="layui-form-label">日期</label>
    <div class="layui-input-block">
         <input type="date" name="date" th:value="${#dates.format(apple.date, 'yyyy-MM-dd')}" required  lay-verify="required" placeholder="日期" autocomplete="off" class="layui-input">
    </div>

刷新，点击修改按钮，跳转到updUser.html页面，可以看到日期已经获取到并且正常显示了。