antd日期时间选择datepicker使用两个分别作为开始时间、结束时间,设置禁用日期和时间点

        功能要求:使用两个antd日期时间选择datepicker分别作为开始时间、结束时间,开始时间的禁用日期设置为今天的前一天,禁用时间设置为今天当前时间点之前的时间,结束时间不能早于开始时间。

        具体规则:

        1. 设置开始时间DatePicker的规则,禁用今天前一天及之前的所有日期,并且禁用今天当前时间点之前的时间,如果选择的日期是今天之后的日期,时间点不做禁用限制。
        2. 设置结束时间 DatePicker 的规则,结束时间不能早于开始时间。

import React, { useState } from 'react';
import { DatePicker, Space } from 'antd';
import moment from 'moment';

const App = () => {
  const [startDate, setStartDate] = useState('');

  const handleStartDateChange = (date) => {
    setStartDate(date);
  };

  const disabledStartDate = (current) => {
    return current && current < moment().subtract(1, 'days').endOf('day');
  };

  const disabledStartDateTime = (date) => {
    if (date && date.isSame(moment(), 'day')) {
      return {
        disabledHours: () => Array.from({ length: mome
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值