Element Plus 日期选择器 获取选中的日期的格式(当前日期/时间戳格式)

简介: Element Plus 日期选择器 获取选中的日期的格式(当前日期/时间戳格式)

Element Plus的日期选择器如果没有进行处理,就会返回data格式:

1.转换为选中的日期

如果想要获取选中的日期时间就需要通过,Element Plus 日期选择器 format属性和value-format属性。format指定输入框的格式。 value-format 指定绑定值的格式。

为日期选择器添加下面的代码,那么获取的值就会变成你选中的日期

format="YYYY/MM/DD"

value-format="YYYY-MM-DD"

  <el-date-picker
        v-model="value"
        type="date"
        placeholder="请选择时间"
        format="YYYY/MM/DD"
        value-format="YYYY-MM-DD"
      />

效果图:

2.转换为时间戳格式

如果想要转换为时间戳格式,也是需要更改 value-format属性。将value-format属性改为:

value-format="x" 即可。

代码:

<el-date-picker
        v-model="value"
        type="date"
        placeholder="请选择时间"
        format="YYYY/MM/DD"
        value-format="x"
          />

效果图:

目录
相关文章
|
JavaScript 前端开发
JavaScript实现input框获取系统默认年月日时分秒
JavaScript实现input框获取系统默认年月日时分秒
284 0
|
C# 前端开发
WPF DatePicker默认显示当前日期,格式化为年月日
原文:WPF DatePicker默认显示当前日期 WPF的日历选择控件默认为当前日期,共有两种方法,一种静态,一种动态。 静态的当然写在DatePicker控件的属性里了,动态的写在对应的cs文件里,具体请看下面。
6488 0
|
3月前
|
JavaScript 前端开发
QML中的Date将时间戳和指定格式时间互转
QML中的Date将时间戳和指定格式时间互转
72 0
|
4月前
Element UI【组件拓展】el-datetime-picker-before 禁止选择未来时间的日期时间选择器(精确到时分秒)
Element UI【组件拓展】el-datetime-picker-before 禁止选择未来时间的日期时间选择器(精确到时分秒)
150 1
|
5月前
|
前端开发 JavaScript 容器
input的date日期如何改样式
input的date日期如何改样式
153 0
|
6月前
可修改文字颜色和限制最大日期的时间选择器使用示例
可修改文字颜色和限制最大日期的时间选择器使用示例
37 0
|
JSON JavaScript 前端开发
uniapp时间戳转换成年月日时分秒的格式
uniapp时间戳转换成年月日时分秒的格式
388 1
uniapp时间戳转换成年月日时分秒的格式
|
JavaScript
DateTimePicker 日期时间选择器,默认获取当前日期
DateTimePicker 日期时间选择器,默认获取当前日期
347 1
|
JavaScript 前端开发 程序员
DatePicker 日期选择器,获取系统默认当前年月日
DatePicker 日期选择器,获取系统默认当前年月日
465 0
如何让日期时间控件不显示时间,直接显示字符串"YYYY-MM-DD"
如何让日期时间控件不显示时间,直接显示字符串"YYYY-MM-DD"