如何使 React Calendar Range 在首次呈現時不選擇當前日期

Question

我正在使用 React 日歷https://www.npmjs.com/package/react-calendar ，我想通過單擊開始日期和結束日期來選擇一個天數范圍。 我在 Calendar 中使用了 selectRange 道具，但是第一次 Calendar 呈現時，甚至沒有點擊任何東西，范圍選擇器將自動將開始日期作為今天的日期。 我不想要這個。 我想以干凈的狀態加載日歷，然后當我開始單擊這將是開始日期時，然后我可以單擊結束日期的下一個元素。 我怎樣才能做到這一點？

這是我的代碼：

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></>}

        </>
    )
}

這是我不想要的功能示例（加載時它會自動選擇今天的日期（6 月 5 日），然后我開始懸停以單擊結束日期）： https : //i.gyazo.com/91ec726a453c2b138f9c1b0aae09e1a6.mp4

Answer 1

好吧，我想出了答案。 我正在復制入門代碼，但我不知道 value 道具也設置了 Beginning 值。 如果我從 <Calendar /> 中刪除該道具，那么一切正常，我可以選擇開始日期而不自動獲取當前日期。

Answer 2

問題是您將value初始化為今天（ new Date() ）並分配給Calendar的value道具。 我建議您使用defaultValue （以不受控制的方式使用 react-calendar）。