Element DateTimePicker 日期时间选择器 今天日期设置,并获取value值

本文介绍了在Vue项目中使用Element UI的DateTimePicker组件时,如何设置默认日期时间值以及如何获取格式化的value值。通过设置`value-format`属性为`yyyy-MM-dd HH:mm:ss`来格式化日期时间,然后在`created()`钩子函数中利用`dateString()`方法结合`new Date()`获取当前日期,并结合`substring()`进行截取,初始化`value`值为年月日20:30:00。详细代码示例和更多参考见官方文档。
摘要由CSDN通过智能技术生成

Element DateTimePicker 日期时间选择器 默认时间设置,并获取value值

如何设置默认值,获取时间格式value值

value-format设置

value-format=“yyyy-MM-dd HH:mm:ss” //对样式进行格式化

dateString()
通过dateString()方法对value值进行初始化
created()创建初始化
Data获取现在的日期 年月日小时分钟秒
substring()对获取到的时间进行截取 这里我只截取了年月日,时分秒我设置了自己的默认,可继续下去自己截取

export default {
data() {
return {
// value: ‘2019-08-17 20:30:00’,
value: ‘’,
};
},
methods: {
dateString: function () {
let year = new Date().toLocaleDateString().substring(0, 4);
let month = new Date().toLocaleDateString().substring(5, 6);
let day = new Date().toLocaleDateString().substring(7, 9);
return year+"-"+month+"-"+day+" "+“20:30:00”;
}
},
created(){
this.value=this.dateString();
}
};

具体可参考https://element.eleme.cn/#/zh-CN/component/datetime-picker

完整代码如下

代码片.

// 创建一个Vue文本,如test.vue,将以下内容放入
<template>
  <div class="block">
    <span class="demonstration">时间默
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值