el-date-picker 限制日期范围

3,321 阅读1分钟

要求:最多只能选择到今天,并且日期跨度不超过一个月

template 部分

<el-date-picker v-model="dateRange" type="daterange" :picker-options="pickerOptions"
placeholder="选择日期范围最多31天">
</el-date-picker>

js 部分

moment()方法参考:momentjs.cn/docs/#/mani…

pickerOptions: {
	onPick: ({
		maxDate,
		minDate
	}) = >{
		this.pickerMinDate = minDate.getTime();
		if (maxDate) {
			this.pickerMinDate = ''
		}
	},
	disabledDate: time = >{
		if (this.pickerMinDate !== '') {
			let maxTime = new Date(moment(this.pickerMinDate).add(1, 'months')).getTime();
			if (maxTime > new Date()) {
				maxTime = new Date()
			}
			return time.getTime() > maxTime || time.getTime() < new Date('2019-01-01 00:00:00').getTime();
		}
		return time.getTime() > Date.now() || time.getTime() < new Date('2019-01-01 00:00:00').getTime();
	}
}