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

 更新时间:2023年10月18日 15:09:23   作者:.星空.  
如果想要获取选中的日期时间就需要通过,Element Plus 日期选择器 format属性和value-format属性,format指定输入框的格式,value-format 指定绑定值的格式,本篇文章就给大家介绍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"
          />

效果图:

到此这篇关于Element Plus 日期选择器 获取选中的日期的格式(当前日期/时间戳格式)的文章就介绍到这了,更多相关Element Plus 日期选择器内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • VueJs单页应用实现微信网页授权及微信分享功能示例

    VueJs单页应用实现微信网页授权及微信分享功能示例

    本篇文章主要介绍了VueJs单页应用实现微信网页授权及微信分享功能示例,具有一定的参考价值,有兴趣的可以了解一下
    2017-07-07
  • Vue2中配置Cesium全过程

    Vue2中配置Cesium全过程

    这篇文章主要介绍了Vue2中配置Cesium全过程,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-05-05
  • Vue2动态添加属性导致页面不更新的原因与解决方案

    Vue2动态添加属性导致页面不更新的原因与解决方案

    在 Vue2 开发中,经常会遇到这样一个问题:对象新增属性后,数据虽然更新了,但页面并没有随之更新,本文将通过一个例子来说明原因,并给出解决方案,需要的朋友可以参考下
    2025-10-10
  • Vue进度条progressbar组件功能

    Vue进度条progressbar组件功能

    progressbar组件在一个可以直接运行的npm包,通过Yeoman进行构建,再通过Gulp+Webpack构建工具。这篇文章给大家介绍了Vue进度条progressbar组件
    2018-04-04
  • Vue3路由query参数实例详解

    Vue3路由query参数实例详解

    文章介绍了Vue3路由的query参数,包括其定义、使用方法以及如何在组件中接收和展示query参数,通过一个简单的实例,展示了如何在路由配置中添加query参数,并在子组件中通过计算属性获取和显示这些参数,感兴趣的朋友跟随小编一起看看吧
    2025-12-12
  • Vue项目中在父组件中直接调用子组件的方法

    Vue项目中在父组件中直接调用子组件的方法

    这篇文章主要给大家介绍了Vue项目中如何在父组件中直接调用子组件的方法,文章通过代码示例介绍的非常详细,对大家的学习或工作有一定的帮助,需要的朋友可以参考下
    2023-11-11
  • vant steps流程图的图标使用slot自定义方式

    vant steps流程图的图标使用slot自定义方式

    这篇文章主要介绍了vant steps流程图的图标使用slot自定义方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-06-06
  • 手动挂载Vue3.0组件到DOM节点的方法

    手动挂载Vue3.0组件到DOM节点的方法

    在VUE应用中,经常会使用一些非vue实现的js库,这些js库可能要求外部传入一些界面DOM节点,本文主要介绍了手动挂载Vue3.0组件到DOM节点的方法,感兴趣的可以了解一下
    2024-08-08
  • Vue如何获取下拉框中选中的value值和label值

    Vue如何获取下拉框中选中的value值和label值

    这篇文章主要介绍了Vue如何获取下拉框中选中的value值和label值问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2023-10-10
  • 浅谈vue3中effect与computed的亲密关系

    浅谈vue3中effect与computed的亲密关系

    这篇文章主要介绍了浅谈vue3中effect与computed的亲密关系,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-10-10

最新评论