前端:Vue element-ui
<el-form-item label="过期时间" :rules="[ { required: true, message: '请选择过期时间', trigger: 'blur' }]">
<el-date-picker v-model="form.expireTime" type="date" format="yyyy-MM-dd" value-format="yyyy-MM-dd" placeholder="选择日期"></el-date-picker>
</el-form-item>
如下图:
format:显示在输入框中的格式
value-format:可选,绑定值的格式,不指定则绑定值为 Date 对象,即给接口传参的格式。
后端 接收参数
@Data
public class ThirdClientDTO implements Serializable {
private static final long serialVersionUID = 1L;
@ApiModelProperty(value = "ID")
private Integer id;
@ApiModelProperty(value = "应用名称")
private String appName;
@DateTimeFormat(pattern = "yyyy-MM-dd")
@JsonFormat(pattern = "yyyy-MM-dd")
@ApiModelProperty(value = "过期时间")
private Date expireTime;
}
使用 @DateTimeFormat(pattern = “yyyy-MM-dd”) 和 @JsonFormat(pattern = “yyyy-MM-dd”) 作用在日期字段上。
注意:前后端Date参数的格式要保持一致。