Element-UI DatePicker 日期选择器默认当前日、月、年 附有源码!!!-前端-阿习进阶博客
Java
MySQL
大数据
Python
前端
黑科技
    首页 >> 互联网 >> 前端

Element-UI DatePicker 日期选择器默认当前日、月、年 附有源码!!!

[导读]:首图获取的年份 点击事件获取数据修改 v-model的值。<el-date-pickerv-model="ARstatistics_time"type="year"format="yyyy"value-format="yyyy"placeholder="选择年":editable="false"@click=&qu...

image.png

首图获取的年份 点击事件获取数据修改 v-model的值。

<el-date-picker
 v-model="ARstatistics_time"
 type="year"
 format="yyyy"
 value-format="yyyy"
 placeholder="选择年"
 :editable="false"
 @click="getYear"
 >
</el-date-picker>

1.默认当前日的时间

<el-date-picker
    v-model="dateValue"
    type="date"
    size="small"
    format="yyyy-MM-dd"
    value-format="yyyy-MM-dd"
    :editable="false"
    @click="getDate"
>

//在data中定义一个空时间

dateValue:"";

//methods中定义方法

getDate(){
 this.dateValue = new Date()
}

//在生命周期中对方法进行调用

mounted(){
 this.getDate()
}

2.默认当前月的时间

<el-date-picker
    v-model=“monthValue”
    type=“month”
    format=“yyyy-MM”
    value-format=“yyyy-MM”
    :editable=“false”
    @click=“getMonth”
>

//在data中定义一个空时间

monthValue:"";

//methods中定义方法

getMonth(){
    var data = new Date()
    var year = data.getFullYear();
    var month = data.getMonth();
    var toMonth = year + ‘-’ + (month + 1)
    this.monthValue = toMonth
}

//在生命周期中对方法进行调用

mounted(){
    this.getdayValue()
}

2、elementui日期选择器默认当前年的时间

<el-date-picker
    v-model=“yearValue”
    type=“year”
    format=“yyyy”
    value-format=“yyyy”
    :editable=“false”
    @click=“getYear”
>

//在data中定义一个空时间

yearValue:’’;

//methods中定义方法

getYear(){
    var year = new Date().getFullYear()+’’;
    this.yearValue = year;
}

//在生命周期中对方法进行调用

mounted(){
    this.getYear()
}

本文来自阿习进阶博客,如若转载,请注明出处:https://yanxias.com

留言区

联系人:
手   机:
内   容:
验证码:

历史留言

联系人:阿习

手机号:156****7890

留言内容:欢迎大家一起讨论文章,有喜欢发帖的可以私聊我给你开权限,发文章

留言时间:2022-05-09 17:46:15

回复内容:互联网阿习

回复时间:2022-05-09 17:46:15

用户IP:220.***.***.232

用户操作系统:Windows 10

欢迎加Easy的QQ