antd RangePicker限制最大时间跨度31天

antd RangePicker限制最大时间跨度31天

type RangeValue = [Moment | null, Moment | null] | null;
const {RangePicker} = DatePicker;

const dateFormat: string = 'YYYY-MM-DD';
const start = moment().subtract(7, 'day').startOf('day');
const end = moment().subtract(1, 'day').endOf('day');

<RangePicker
       allowClear={false}
       value={dates}
       disabledDate={disabledDate}
       onCalendarChange={val => setDates(val)}
       onOpenChange={onOpenChange}
       ormat={dateFormat}
/>

    const [timeRange, setTimeRange] = useState<RangeValue>([start, end]);
    const [dates, setDates] = useState<RangeValue>([start, end]);
    const disabledDate = (current: Moment) => {
        if (!dates) {
            return false;
        }
        const tooLate = dates[0] && current.diff(dates[0], 'days') > 31;
        const tooEarly = dates[1] && dates[1].diff(current, 'days') > 31;
        const isAfter = current && moment(current).isAfter();
        return !!tooEarly || !!tooLate || isAfter;
    };

    const onOpenChange = (open: boolean) => {
        if (open) {
            setDates([null, null]);
        }
        else if (dates?.filter(it => it)?.length < 2) {
            setTimeRange([start, end]);
            setDates([start, end]);
        }
        else if (dates?.filter(it => it)?.length === 2) {
            setTimeRange(dates);
        }
    };

  • 7
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值