ReactJS Ant Design - 在 DatePicker 中禁用小于任何默认日期的日期

Posted 2023-03-07

【中文标题】ReactJS Ant Design - 在 DatePicker 中禁用小于任何默认日期的日期

【英文标题】：ReactJS Ant Design - Disable dates less than any default date in DatePicker

【发布时间】：2019-04-25 22:28:52

【问题描述】：

在 antd framework 上工作，我正在尝试禁用小于给定 defaultDate 的 DatePicker 日期，我无法以任何方式正确设置。情况是说日期选择器的 defaultDate 是 2028-12-20 所有日期都应在此以下禁用..

执行此操作的回调如下

disabledDate = (current) => 
    return current && current < moment().endOf('day');;

其中 current = defaultDate 已提供它不会改变，我不知道如何做到这一点..

我已经创建了一个沙盒here

任何帮助将不胜感激。

谢谢。

【问题讨论】：

请检查这个codesandbox.io/s/p34o4v7wlj，这是你要找的吗？

我更新了一个例子codesandbox.io/s/p34o4v7wlj

@EugeneDzhevadov 它现在已禁用所有日期..

所以，current 是从组件传递的，我的猜测是它总是今天，但是您可以定义一个 default 值而不是 current 并执行任何逻辑更多、更少或相等，但我看到组件显示今天日期

【参考方案1】：

可以通过以下方式完成：

disabledDate(current) 
  let customDate = "2018-11-25";
  return current && current < moment(customDate, "YYYY-MM-DD");

这里是working demo

【讨论】：

太棒了，这似乎工作正常，我当时叫错了方式.. 非常感谢。

比你，但我需要在日历日期应该只在当前日期前 7 天启用

current && current > moment() 禁用未来日期 ;)

【参考方案2】：

此外，您可以通过启用可用的日期范围/时段来禁用日期。

npm install date-fns

添加或子天的包裹。

import subDays, addDays  from 'date-fns'

最终代码

<DatePicker 
disabledDate=d => !d || d.isAfter(addDays( new Date(), 7)) || d.isSameOrBefore(subDays( new Date(), 1)) />

希望对你有帮助。