自学内容网 自学内容网

vue element-ui日期控件传参

前端: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参数的格式要保持一致。


原文地址:https://blog.csdn.net/m0_37978198/article/details/140710088

免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!