Reactjs 反应日期选择器如何在预订日期之间选择日期？

我尝试在一个选项中选择日期，例如1到16，但禁用日期阻止我

import React, {useState, Component } from 'react'
import {Datepicker, START_DATE} from '@datepicker-react/styled'
import HolidayService from '../../servicees/HolidayService'
import dateFormat from "dateformat";
class calendar extends Component {
    constructor(props) {
        super(props)

        this.state = {
            // step 2
            startDate: null,
            endDate: null,
            focusedInput: START_DATE,
            holidays:[]
        }
        this.handleChange=this.handleChange.bind(this)
        this.handleDatesChange=this.handleDatesChange.bind(this)
        this.blockedDate=this.blockedDate.bind(this)
       
    }

     handleDatesChange(data) {
        if (!data.focusedInput) {
            this.setState({...data, focusedInput: START_DATE})
        } else {
          this.setState(data)
        }
      }
      componentDidMount(){
          HolidayService.getHoliday().then(res => {
            this.setState({ holidays: res.data});
        
    });
      }
      
      
       handleChange(value, e) {
        console.log(value +"hi"); // this will be a moment date object
        console.log(e.target.value); // this will be a string value in datepicker input field
      }
       blockedDate (date){
        var show = false;
       
      this.state.holidays.map(map=>{
        
        if (date.getDay()==6|| date.getDay()==0||dateFormat(date.toLocaleDateString(), "yyyy-mm-dd")==map.date){
          show =true
         
        }
      })
          
          return show
        }
    
    
    render() {
     
      
        return (
            <Datepicker
          

  onDatesChange={this.handleDatesChange}
            onChange={this.handleChange}
            startDate={this.state.startDate} // Date or null
            endDate={this.state.endDate} // Date or null
            focusedInput={this.state.focusedInput} // START_DATE, END_DATE or null
                isDateBlocked={this.blockedDate}
             />
        )
    }
}

export default calendar;

import React，{useState，Component}来自“React”
从'@Datepicker react/styled'导入{Datepicker，START_DATE}
从“../../services/HolidayService”导入HolidayService
从“dateFormat”导入dateFormat；
类日历扩展组件{
建造师（道具）{
超级（道具）
此.state={
//步骤2
startDate:null，
endDate:null，
焦点输入：开始日期，
假期：[]
}
this.handleChange=this.handleChange.bind（this）
this.handleDatesChange=this.handleDatesChange.bind（this）
this.blockedDate=this.blockedDate.bind（this）
}
handleDatesChange（数据）{
如果（！data.focusedInput）{
this.setState（{…data，focusedInput:START_DATE}）
}否则{
此.setState（数据）
}
}
componentDidMount（）{
HolidayService.getHoliday（）.then（res=>{
this.setState（{holidays:res.data}）；
});
}
handleChange（值，e）{
console.log（value+“hi”）；//这将是一个时刻日期对象
console.log（e.target.value）；//这将是datepicker输入字段中的字符串值
}
封锁日期（日期）{
var show=false；
this.state.holidays.map（map=>{
如果（date.getDay（）==6 | | date.getDay（）==0 | | dateFormat（date.toLocaleDateString（），“yyyy-mm-dd”）==map.date）{
show=true
}
})
回归演出
}
render（）{
返回(
)
}
}
导出默认日历；