DateTimePicker + @DateTimeFormat("yyyy-MM-dd HH:mm:ss")日期格式转换异常

最近在做的一个项目使用的日期格式是yyyy-MM-dd HH:mm:ss格式的,在后端Java与MySQL这边的转换中一开始格式没有统一间歇性的就会报异常,后面采用了一个@DateTimeFormat("yyyy-MM-dd HH:mm:ss")注解标注在属性上规范了 Date 类型属性的格式(埋坑~)

在前端这边使用的是ElementUI的日期时间组件DateTimePicker

<div class="block">
    <span class="demonstration">默认</span>
    <el-date-picker
      v-model="value1"
      type="datetime"
      placeholder="选择日期时间">
    </el-date-picker>
  </div>

使用该组件进行新增操作的时候一直抛异常
JSON parse error: Cannot deserialize value of type java.util.Date from String "2020-01-30T16:00:00.000Z"

网上搜了好多资料,几乎都是说在后端属性上添加注解的

 @JsonFormat(shape = JsonFormat.Shape.STRING, pattern="yyyy-MM-dd HH:mm:ss", timezone = "GMT+8")
 @JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
 @JsonField(format = "yyyy-MM-dd HH:mm:ss" )

这些注解都尝试过,都不能解决问题,一直修改重启修改重启搞的贼烦躁,后面在大佬的提示下去看了Element官网文档,在DateTimePicker这个组件的Attributes中看到了format

format 显示在输入框中的格式 string 见日期格式 yyyy-MM-dd HH:mm:ss

日期格式
使用format指定输入框的格式；使用value-format指定绑定值的格式。
默认情况下，组件接受并返回Date对象。以下为可用的格式化字串，以 UTC 2017年1月2日 03:04:05 为例：
请注意大小写
格式 含义 备注 举例
yyyy 年 2017
M 月 不补0 1
MM 月 01
W 周 仅周选择器的 format 可用；不补0 1
WW 周 仅周选择器的 format 可用 01
d 日 不补0 2
dd 日 02
H 小时 24小时制；不补0 3
HH 小时 24小时制 03
h 小时 12小时制，须和 A 或 a 使用；不补0 3
hh 小时 12小时制，须和 A 或 a 使用 03
m 分钟 不补0 4
mm 分钟 04
s 秒 不补0 5
ss 秒 05
A AM/PM 仅 format 可用，大写 AM
a am/pm 仅 format 可用，小写 am
timestamp JS时间戳 仅 value-format 可用；组件绑定值为number类型 1483326245000
[MM] 不需要格式化字符 使用方括号标识不需要格式化的字符 (如 [A] [MM]) MM

因为使用的是动态变量,所以在在该组件中添加了value-format属性,设置了与后台对应的格式

<div class="block">
    <span class="demonstration">默认</span>
    <el-date-picker
      v-model="value1"
      value-format="yyyy-MM-dd HH:mm:ss"
      type="datetime"
      placeholder="选择日期时间">
    </el-date-picker>
  </div>

翻了大半天的资料,终于解决了问题,得记录一下,学习起来才行!

https://editor.csdn.net/md/?articleId=104067771

原文地址：https://www.cnblogs.com/unrecognized/p/12228013.html