el-date-picker常见问题

 

一、设置时间格式问题

        我们可以通过format和 value-format设置得到选择的格式

<el-date-picker ref="datePicker" v-model="time" type="datetime" format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss" 
placeholder="选择时间" :picker-options="pickerOptions" @change="selectTime">
</el-date-picker>

二、当前日期 之前的日期不能选择

        通过设置picker-options来设置,千万注意pickerOptions写的位置,在data中,别写错了哦!

data() {
	return {
        time: '',
        pickerOptions: {
            disabledDate(time) {
                return time.getTime() < new Date();
            }
        },
    }
}

 三、点击“此刻”按钮,不关闭选择框

        我是这么想的,通过change事件将选择的时间与获取的当前时间作比较,点击此刻获取的时间必定和获取的当前时间一致,那么再次强制打开选择框,看代码!

selectTime(value) {
	// 获取当前时间
	const yy = new Date().getFullYear()
	const MM = (new Date().getMonth() + 1) < 10 ? '0' + (new Date().getMonth() + 1) : (new Date().getMonth() +1)
	const dd = new Date().getDate() < 10 ? '0' + new Date().getDate() : new Date().getDate()
	const HH = new Date().getHours() < 10 ? '0' + new Date().getHours() : new Date().getHours()
    const mm = new Date().getMinutes() < 10 ? '0' + new Date().getMinutes() : new Date().getMinutes()
	const ss = new Date().getSeconds() < 10 ? '0' + new Date().getSeconds() : new Date().getSeconds()
	var nowtime =  yy + '-' + MM + '-' + dd + ' ' + HH + ':' + mm + ':' + ss;
	if(value == nowtime){
		this.$refs.datePicker.showPicker(); //打开选择框
	}
},

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值