需求 ：选择日期时，只能选择当天及之后的日期，之前的日期不可选；选择时间时，只能选择当日当前及之后的时间点；

例子 ：如果当前时间时 2021年01月10日 08:08:08，那么 DatePicker 组件可选的日期和时间范围只能是 2021年01月10日 08:08:08 之后的日期和时间，如：2021年01月10日 08:09:00

解决方案 ： 因为使用的是 Ant Design V4.0 版本组件库 ，该 DatePicker 组件有两个属性： disabledDate 和 disableTime ，分别用来控制不可选日期和不可选时间， disabledTime 需要和 showTime 一起使用；详见代码和注释内容：

不可选择日期：

import React from 'react';
import { DatePicker } from 'antd';
import moment from 'moment';
const DatePicker = () => {
  const disabledDate = current => {
    // Can not select days before today and today
    // return current && current < moment().endOf('day');
    // Can not select days before today
    // return current && current < moment().subtract(1, 'days');
    return current && moment(current).isBefore(moment(), 'day');
  return (
    <DatePicker
      format="YYYY/MM/DD HH:mm:ss"
      showTime
      disabledDate={disabledDate}
      placeholder="Please Select Date"
      className="date-picker"
export default DatePicker;

不可选时间限制：

import React from 'react';
import { DatePicker } from 'antd';
import moment from 'moment';
const DatePicker = () => {
  const range = (start, end) => {
    const result = [];
    for (let i = start; i < end; i++) {
      result.push(i);
    return result;
  const disabledDate = current => {
    return current && moment(current).isBefore(moment(), 'day');
  const disabledTime = current => {
    const hours = moment().hours()
    const minutes = moment().minutes()
    // const seconds = moment().seconds()
    const currentHour = moment(current).hour();
    if (current && moment(current).date() === moment().date()) {
      return {
        disabledHours: () => this.range(0, 24).splice(0, hours),
        disabledMinutes: () => {
          if (currentHour === moment().hour()) {
            return this.range(0, 60).splice(0, minutes);
          return [];
        // 秒的限制没什么意义，这里的逻辑也存在问题，解决思路如分钟的限制
        // disabledSeconds: () => this.range(0, 60).splice(0, seconds + 1),
    return {
      disabledHours: () => [],
      disabledMinutes: () => [],
      // disabledSeconds: () => [],
  return (
    <DatePicker
      format="YYYY/MM/DD HH:mm:ss"
      showTime
      disabledDate={disabledDate}
      disabledTime={disabledTime}
      placeholder="Please Select Date and Time"
      className="date-picker"
export default DatePicker;

需求：选择日期时，只能选择当天及之后的日期，之前的日期不可选；选择时间时，只能选择当日当前及之后的时间点；例子：如果当前时间时 2021年01月10日 08:08:08，那么 DatePicker 组件可选的日期和时间范围只能是 2021年01月10日 08:08:08 之后的日期和时间，如：2021年01月10日 08:09:00解决方案： 因为使用的是 Ant Design V4.0 版本组件库，该 DatePicker 组件有两个属性：disabledDate和 disableTime...