reactjs - 为什么 react-day-picker onDayClick 给出没有重载匹配这个 cal 错误？

问题描述

我对 React 还很陌生，我正在尝试使用 [react-day-picker][1] 作为一个简单的日期选择选项。问题是我复制了 [example] [2] 中的代码，但是 onDayPick 参数有一条波浪线并给了我这个错误

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

这是我的组件，以防我在复制时做错了什么

import React from 'react';
import DayPicker from 'react-day-picker';
import 'react-day-picker/lib/style.css';



export default class DatePicker extends React.Component<{}, {selectedDay: any}>{
    constructor(props) {
        super(props);
        this.state = {
                selectedDay: undefined,
        }
        this.handleDayClick = this.handleDayClick.bind(this);

    }

    handleDayClick(day, { selected, disabled }) {
        if (disabled) {
          // Day is disabled, do nothing
          return;
        }
        if (selected) {
          // Unselect the day if already selected
          this.setState({ selectedDay: undefined });
          return;
        }
        this.setState({ selectedDay: day });
      }
      render() {
          return(
            <div>
                <DayPicker
                onDayClick={this.handleDayClick}
                selectedDays={this.state.selectedDay}
                        />
                        {this.state.selectedDay ? (
                        <p>You clicked {this.state.selectedDay.toLocaleDateString()}</p>
                        ) : (
                        <p>Please select a day.</p>
                        )}
            </div>
          )
      }
}

  [1]: https://react-day-picker.js.org/
  [2]: https://react-day-picker.js.org/docs/basic-concepts

标签： reactjsreact-day-picker

reactjs - 为什么 react-day-picker onDayClick 给出没有重载匹配这个 cal 错误？

问题描述

解决方案

推荐阅读