输入“日期范围”<date | null> ' 不可分配给类型 'ValueType'</date>

Question

i want to implement a calendar where the user will be able to select multiple full weeks. i am using the library rsuite for that. I want to pass inside the property value of dateRangePicker of rsuite the value "selectedDates" which is of type

  const [selectedDate, handleDateChange] = useState<DateRange<Date | null>>([checkIn, checkOut]);"
   const checkIn = row.checkInDate ? row.checkInDate : null;
   const checkOut = row.checkOutDate ? row.checkOutDate : null;

and i got the following error

Type 'DateRange<Date | null>' is not assignable to type 'ValueType'. Type at position 0 in source is not compatible with type at position 0 in target. Type 'Date | null' is not assignable to type 'Date | undefined'. Type 'null' is not assignable to type 'Date | undefined'.ts(2322) common.d.ts(103, 3): The expected type comes from property 'value' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<DateRangePickerProps, any, any>> & Readonly<...> & Readonly<...>'

Can anyone help me solve that?

UPDATE:

with the valueType as i understand i can only pass Date | undefined, but if I pass inside the value property of the daterangepicker an undifined, when i try to change month i got NaN dates and invalid dates (look image)

Answer 1

i want to implement a calendar where the user will be able to select multiple full weeks. i am using the library rsuite for that. I want to pass inside the property value of dateRangePicker of rsuite the value "selectedDates" which is of type

  const [selectedDate, handleDateChange] = useState<DateRange<Date | null>>([checkIn, checkOut]);"
   const checkIn = row.checkInDate ? row.checkInDate : null;
   const checkOut = row.checkOutDate ? row.checkOutDate : null;

and i got the following error

Type 'DateRange<Date | null>' is not assignable to type 'ValueType'. Type at position 0 in source is not compatible with type at position 0 in target. Type 'Date | null' is not assignable to type 'Date | undefined'. Type 'null' is not assignable to type 'Date | undefined'.ts(2322) common.d.ts(103, 3): The expected type comes from property 'value' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<DateRangePickerProps, any, any>> & Readonly<...> & Readonly<...>'

Can anyone help me solve that?

UPDATE:

with the valueType as i understand i can only pass Date | undefined, but if I pass inside the value property of the daterangepicker an undifined, when i try to change month i got NaN dates and invalid dates (look image)