Блог

У меня есть функциональный компонент, в котором я использую компонент выбора дня реакции. На странице примеров они используют компонент на основе классов и предоставляют этот пример того, как обрабатывать выбор дня:

 ...
handleDayClick(day, { selected }) {
}
...
        <DayPicker
          onDayClick={this.handleDayClick}
        />
 

В моем функциональном компоненте я сделал это:

   const handleDayClick = (day, { selected }) => {
    ...
  }
...
                <DayPicker
                  onDayClick={handleDayClick}
                />
 

Но TypeScript жалуется, говоря (с onDayClick подчеркиванием):

 No overload matches this call.
  Overload 1 of 2, '(props: DayPickerProps | Readonly<DayPickerProps>): DayPicker', gave the following error.
    Type '(day: any, { selected }: { selected: any; }) => void' is not assignable to type '(day: Date, modifiers: DayModifiers, e: MouseEvent<HTMLDivElement, MouseEvent>) => void'.
      Types of parameters '__1' and 'modifiers' are incompatible.
        Property 'selected' is missing in type 'DayModifiers' but required in type '{ selected: any; }'.
  Overload 2 of 2, '(props: DayPickerProps, context: any): DayPicker', gave the following error.
    Type '(day: any, { selected }: { selected: any; }) => void' is not assignable to type '(day: Date, modifiers: DayModifiers, e: MouseEvent<HTMLDivElement, MouseEvent>) => void'.ts(2769)
 

Также пробовал это:

                 <DayPicker
                  onDayClick={() => handleDayClick()}
                />

 

Но тогда я не знаю, какие параметры предоставить handleDayClick() функции, которая ожидает два параметра, и поэтому TypeScript жалуется на это: Expected 2 arguments, but got 0.

Любая помощь приветствуется!

Измените параметры функции на это, чтобы сделать TypeScript счастливым:

 const handleDayClick(day: Date, modifiers: DayModifiers)