在反应日选择器上设置最小和最大日期答案

【问题标题】：Set min and max date on react day picker在反应日选择器上设置最小和最大日期
【发布时间】：2018-01-31 05:43:15
【问题描述】：

如何设置最大或最小日期？例如，我想将我的 daypicker 限制为仅在过去 2 个月（最小日期）到今天（最大日期）。所以用户不能选择明天的日期。谢谢

http://react-day-picker.js.org/docs/

【问题讨论】：

标签： datepicker react-day-picker react-datepicker

【解决方案1】：

您需要使用disabledDays 属性。它可以传递一组修饰符，详见http://react-day-picker.js.org/docs/modifiers

以下应该可以满足您的需要：

var twoMonthsAgo = new Date();
twoMonthsAgo.setMonth(twoMonthsAgo.getMonth() - 2);

<DayPicker disabledDays={
{ 
    before: twoMonthsAgo, 
    after: new Date()
}} />

【讨论】：

【解决方案2】：

从文档React Day Picker Modifiers 看来，您可以传递fromMonth 的道具，您可以计算出今天日期前两个月的月份。您还可以传递一个 disabledDays 属性，该属性将根据您的参数禁用天数。

const lastMonth = new Date();
lastMonth.setMonth(lastMonth.getMonth() - 2);
<DayPicker
  fromMonth={lastMonth} 
  disabledDays={{ after: today }}
/>

你可能需要稍微调整一下，但它应该会告诉你从哪里开始。

【讨论】：

fromMonth 包括该月的所有日期，因此如果今天是 4 月 20 日，您可以使用您的逻辑从 1 月 1 日开始选择任何日期
听起来这就是问题所要求的：从两个月前到今天的日期范围内。