1

我的项目是用户填写的用于预订检查的表格。我有一个反应日历，他们用它来选择检查日期。我需要日历使当前日期之前的所有日子和所有未来的周末都处于非活动状态（因此只有未来的工作日是可点击的。然后根据用户输入（从可能的检查类型列表中选择）日历来制作未来 1 或 2 天后的第一个可用天。

我已经设法过滤了未来的周末，并且内置的 minDate 道具确保当前日期之前的所有日子都处于非活动状态，但我的过滤仍然有问题。它跳过 7 天而不是 2 天。请帮忙。

const [date, setDate] = useState(new Date());
  const dateFormatted = format(date, "yyyy/MM/dd"); 
  const dateSelected = date =>{
    date.toLocaleDateString();
    setDate(date);
  };
//This is how I get id value of the different inspectiuon types
const [enquiryType, setEnquiryType] = useState('0');
  const handleSelect = (event) => {
    const index = event.target.selectedIndex;
    const optionElement = event.target.childNodes[index];
    const optionElementId = optionElement.getAttribute('id');

    setEnquiryType(optionElementId);
  }

const singleDay = addDays(date, 1);
const doubleDays = addDays(date, 2);

  const calcDays = () => {
    if (enquiryType === '0'){
      return new Date();
    } else if (enquiryType === '1'){
      return singleDay;
    } else if (enquiryType === '2'){
      return doubleDays;
    } 
  }

            <Calendar
            
            tileDisabled={({ date }) => date.getDay() === 0 || date.getDay() === 6}
            prev2AriaLabel={null}
            prev2Label={null}
            next2Label={null}
            locale={null}
            showNeighboringMonth={false}
            minDetail="month"
            minDate={calcDays()}
            value={date}
            onClickDay={dateSelected}
            //onChange={dateSelected} 
            />
4

0 回答 0