Java 日期接收报错：could not be parsed, unparsed text found at index 10（已解决）

---

问题背景

使用 Element-UI 的 el-date-picker 组件 将日期转给Java，Java报错

java.time.format.DateTimeParseException: Text ‘2024-01-03T16:00:00.000Z’ could not be parsed, unparsed text found at index 10

代码

• Vue

<el-date-picker
  v-model="form.removalDate"
  type="date"
  placeholder="选择日期"
  style="width: 300px"
/>

• Java实体类

@Data
@EqualsAndHashCode(callSuper = false)
@Accessors(chain = true)
public class AppProjects implements Serializable {
    
    @TableField(updateStrategy = FieldStrategy.IGNORED)
    @JsonFormat(pattern = "yyyy-MM-dd")
    private Date removalDate;
    
}

• Java控制层

import com.alibaba.fastjson.JSONObject;

public Object update(@RequestBody JSONObject object) {
    AppProjects appProjects = object.toJavaObject(AppProjects.class);
    boolean update = appProjectsService.updateById(appProjects);
    return update;
}

当执行 toJavaObject 方法时，报错如下

java.time.format.DateTimeParseException: Text ‘2024-01-03T16:00:00.000Z’ could not be parsed, unparsed text found at index 10

• 修改Java控制层

更改为使用实体类接收参数 @RequestBody AppProjects appProjects

public Object update(@RequestBody AppProjects appProjects) {
    boolean update = appProjectsService.updateById(appProjects);
    return update;
}

执行方法时不报错，但是日期的值却比实际少一天，为什么呢？
因为前端实际选择日期为 ‘2024-01-04’ ，传值为 ‘2024-01-03T16:00:00.000Z’，该时区不是东八区，使用实体类接收时去掉了时分秒，导致日期保存为 ‘2024-01-03’

已经不报错了，那么解决日期问题就简单了！

解决方法

在 el-date-picker组件 使用属性 value-format="yyyy-MM-dd" 将绑定的格式不指定为 Date 对象，绑定的值会转为 string 对象，那么实际选择哪一天的日期，就是 yyyy-MM-dd 格式的字符串啦！这样后端就能正确接收日期了

<el-date-picker
  v-model="form.removalDate"
  type="date"
  value-format="yyyy-MM-dd"
  placeholder="选择日期"
  style="width: 300px"
/>