如何仅在 react-day-picker 中启用两天

Question

我只需要在 react-day-picker 中启用两天。剩余的日子应该被禁用。谁能给我一个如何实现这个的例子？

我试过 this example 但它对我不起作用。

export default function Example() {
  getDaysInMonth(month, year){
    // Since no month has fewer than 28 days
    let date = new Date(year, month, 1);
    const days = [];
    while (date.getMonth() === month) {
      dateys.push(new Date(date));
      date.setDate(date.getDate() + 1);
    }
    return days;
  }
  const disabledMonth = this.getDaysInMonth(12, 2017);
    return (
      <DayPicker
        initialMonth={new Date(2017, 3)}
        disabledDays={
          this.disabledMonth.filter(
            (date) => ![new Date(2017, 12, 3), new Date(2017, 12, 13)].includes(date)
          )
        }
      />
    );
}

我尝试运行这段代码我得到空数组

Answer 1

一个选项是您可以设置 that the user should not be able to change the month if the two days are within the same month. You can set which month this is with initial month。

然后您可以设置 disabled days 这将是一个日期数组，即当月的天数，不包括可用的两天。

示例：

如果您使用类似 this 的方法来获取一个月内的所有日期，您可以这样做：

import React from 'react';
import DayPicker from 'react-day-picker';
import 'react-day-picker/lib/style.css';

export default function Example() {
  const disabledMonth = getDaysInMonth(11, 2017);

  return (
    <DayPicker
      initialMonth={new Date(2017, 11)}
      disabledDays={
        this.disabledMonth.filter(
          (date) => ![new Date(2017, 11, 3).toString(), new Date(2017, 11, 13).toString()].includes(date.toString())
        )
      }
    />
  );
}

这里我过滤了两个日期，12月3日和13日，应该可以得到。

这是用es6写的

如何仅在 react-day-picker 中启用两天

how to enable two day only in react-day-picker

reactjs

react-day-picker