Usage
As mentioned in the previous section, the initial value can be Date, DateObject, Number, or String, but as soon as the user selects a new date, its type changes to DateObject.
So, if you want to store the selected dates in the state, depending on the type of the initial value; You must add the initial value type plus DateObject and Dateobject[] type, to useState:
import React, { useState } from "react";
import DatePicker, { DateObject } from "react-multi-date-picker"
import type{Value} from "react-multi-date-picker"
export default function Example() {
const [value, setValue] = useState<Value>(new Date());
return <DatePicker value={value} onChange={setValue} />;
}
Adding Ref to Calendar & DatePicker
import React, { useRef } from "react";
import DatePicker, { Calendar, CalendarRef, DatePickerRef } from "react-multi-date-picker"
export default function Example() {
const calendarRef = useRef<CalendarRef>();
const datepickerRef = useRef<DatePickerRef>();
return (
<>
<Calendar ref={calendarRef} />
<DatePicker ref={datepickerRef} />
</>
)
}