前言
当我们在开发的时候，会遇到设置时间的需求，当然我们要保证设置的时间是有效的，这个时候就要给开始时间和结束时间，添加一些限制。比如结束时间要大于开始时间，开始时间的选择区间是当前时间之后。
antd DatePicker组件的api有disabledDate和disabledTime这两个属性，disabledDate控制天数，disabledTime控制时分秒。
核心代码如下：
function range(start, end) {const result = [];for (let i = start; i < end; i++) {result.push(i);}return result;}const handleDisabledRangeTime = (dates) => {const currentHours = moment().hours();const currentMinutes = moment().minutes();const currntSeconds = moment().seconds();const currntDates = moment().date();if (dates) {if (currntDates === dates.date()) {let finalHour;let finalMinute;let finalSeconds;if (dates.hour() > currentHours) {finalMinute = 0;} else {finalHour = currentHours;finalMinute = currentMinutes;finalSeconds = currntSeconds;}return {disabledHours: () => range(0, finalHour),disabledMinutes: () => range(0, finalMinute),disabledSeconds: () => range(0, finalSeconds)};}if (moment() > dates) {return {disabledHours: () => range(0, 24),disabledMinutes: () => range(0, 60),disabledSeconds: () => range(0, 60)};}} else {return {disabledHours: () => range(0, 24),disabledMinutes: () => range(0, 60),disabledSeconds: () => range(0, 60)};}return {};};// 对天数的控制const handleDisabledDate = current => current && current < moment().subtract(1, 'days');<RangePicker disabledDate={handleDisabledDate} disabledTime={handleDisabledRangeTime} />
效果图：
