element 日期选择器 date-picker 设置默认时间(当月1号到当前日期)
程序员文章站
2022-06-07 09:58:13
...
- element 日期选择器结构,两个日期选择器定义开始和结束
<el-date-picker
v-model="startTime"
type="date"
:editable="false"
prefix-icon="el-icon-caret-bottom"
value-format="yyyy-MM-dd"
:clearable='false'>
</el-date-picker>
<span style="padding: 0 3px">--</span>
<el-date-picker
v-model="endTime"
type="date"
:editable="false"
prefix-icon="el-icon-caret-bottom"
value-format="yyyy-MM-dd"
:clearable='false'>
</el-date-picker>
- 定义开始时间和结束时间
data () {
return {
startTime: '',
endTime: ''
}
}
- 计算开始时间和结束时间:开始时间为每个月第一天,结束时间为每月的当前日期
methods: {
getCurrentMonthFirst () {
var date = new Date()
date.setDate(1)
var month = parseInt(date.getMonth() + 1)
var day = date.getDate()
if (month < 10) month = '0' + month
if (day < 10) day = '0' + day
this.startTime = date.getFullYear() + '-' + month + '-' + day
},
getCurrentMonthLast () {
var date = new Date()
var month = parseInt(date.getMonth() + 1)
var day = lastTime.getDate()
if (month < 10) month = '0' + month
if (day < 10) day = '0' + day
this.endTime = date.getFullYear() + '-' + month + '-' + day
},
}
- 初始化时间到日期中
created () {
this.getCurrentMonthFirst()
this.getCurrentMonthLast()
}