Как сделать так, чтобы React Calendar Range НЕ выбирал текущую дату при первом рендеринге

Question

Я использую React Calendar https://www.npmjs.com/package/react-calendar, и я хочу выбрать диапазон дней, щелкнув дату начала и дату окончания. Я использовал свойство selectRange в календаре, но при первом рендеринге календаря, даже не щелкнув ничего, селектор диапазона автоматически будет иметь дату начала как сегодняшнюю дату. Я не хочу это. Я хочу загрузить календарь с чистым состоянием, а затем, когда я начну нажимать, это будет дата начала, тогда я могу щелкнуть следующий элемент для даты окончания. Как я могу этого добиться?

Вот мой код:

      export default function TestCalendar() {
    const [value, onChange] = useState(new Date())

    return(
        <>
        <Calendar selectRange={true} onChange={onChange}
        value={value} minDate={new Date()} minDetail={"year"} navigationAriaLabel={"Go up"} activeStartDate={null}/>

        {value[0] != null && <><div>{value[0].toString()}</div><div>{value[1].toString()}</div></>}

        </>
    )
}

Это пример функциональности, которую я не хочу (когда он загружается, он автоматически выбирает сегодняшнюю дату (5 июня), затем я начинаю наводить курсор, чтобы щелкнуть дату окончания):https://i.gyazo.com/91ec726a453c2b138f9c1b0aae09e1a6.mp4

Answer 1

Проблема в том, что вы инициализировали сегодня ( new Date()) и назначен Calendarс valueопора Я предлагаю вам использовать defaultValue (бесконтрольно использовать реагирующий календарь).

Answer 2

Хорошо, я понял ответ. Я копировал стартовый код и не знал, что свойство value также устанавливает значение Beginning. Если я удалю эту опору из <Calendar />, тогда все будет работать нормально, и я могу просто выбрать дату начала без автоматического получения текущей даты.