{ // //禁用日期let d =。element-ui|element-ui el-date-picker 时间日期组件设置时间日期范围.2。" />
- 首页 > it技术 > >
element-ui|element-ui el-date-picker 时间日期组件设置时间日期范围.2
要求
选择时间,不能跨月
下面时封装的js
插件
"moment": "2.24.0"
HTML调用
js
import moment from 'moment';
// 引入插件let currentDate = '';
// 当前选中的日期let disabledDate = time => { //
//禁用日期
let d = new Date(currentDate);
// 获取当前选择时间
let year = d.getFullYear();
// 获取当前 - 年
let month = d.getMonth() + 1;
// 获取当前 - 月
let day = new Date(year, month, 0).getDate();
// 获取本月天数(获取下一个月的0日即前一月的最后一日)
month = month > 9 ? month : '0' + month;
// 优化月格式
day = day > 9 ? day : '0' + day;
// 优化日格式
let startDay = `${year}-${month}-01 00:00:00`;
// 当月第一天
let endDay = `${year}-${month}-${day} 23:59:59`;
// 当月最后一天
let startTime = new Date(startDay).getTime();
// 第一天时间戳
let endTime = new Date(endDay).getTime();
// 最后一天时间戳
let cutTime = new Date(moment().format('YYYY-MM-DD 23:59:59')).getTime();
// 当前时间戳
if (currentDate !== '') { // 是否选择日期,选择日期,禁用掉不符合要求的时间
return (
time.getTime() < startTime ||
time.getTime() > endTime ||
time.getTime() > cutTime
);
}
return time.getTime() > cutTime;
// 否则禁用大于当前时间的时间
};
let onPick = ({ minDate, maxDate }) => { // 选择时间事件
currentDate = minDate.getTime();
if (maxDate) {
currentDate = '';
}
};
let pickerOption = {
disabledDate,
onPick,
};
export default pickerOption;
推荐阅读