Question

我有一系列禁用日期。我在此http://react-day-picker.js.org/examples/?range尝试了日期愤怒点击示例，以便从和到日期更新。但是，我会从所选范围中获取一系列日期，而不是开始日期和结束日期，并且不包括已禁用的日期（如果有）。

我想，我可以用时间来计算从和到日期之间的差异，以生成范围的日期数组，并消除带条件的禁用日期。

我想知道 react-day-picker 中是否有任何内置辅助函数可以执行相同操作，而不是自己执行此操作。一个例子将非常感激。

提前致谢。

Answer 1

您可以遍历范围内的日期并使用包含的日期填充数组：

let daysList = [];
if (range.from && range.to) {
  daysList = [range.from];

  while (daysList[daysList.length - 1] < range.to) {

    let day = daysList[daysList.length - 1];
    let dayToAdd = new Date(day.getFullYear(), day.getMonth(), day.getDate() + 1);

    if (!isDisabled(dayToAdd)) { // here check if the day is disabled
      daysList.push(dayToAdd);
    }
  }

  daysList.pop();
}
console.log("Selected days:", daysList)

使用范围示例查看此codesandbox。

您需要实现自己的isDisabled功能（这取决于您存储禁用日期的位置），可能是这样的：

disabledDays=[] // your array of disabled days
function isDisabled(day) {
  return disabledDays.find(disabledDay => 
     DateUtils.isSameDay(day, disabledDay)
  )
}

React Day Picker到不包括已禁用日期

1 个答案: