如何解决使用 react-daterange-picker 的 Typescript 错误“没有与此调用匹配的重载”
当我尝试在 React Typescript 应用程序中使用 react-daterange-picker
时,出现错误
No overload matches this call.
Overload 1 of 2,'(props: RangeProps<DaterangePicker> | SingleProps<DaterangePicker> | Readonly<RangeProps<DaterangePicker>> | Readonly<...>): DaterangePicker',gave the following error.
Type 'Date[]' is not assignable to type 'Moment | (MomentRange & typeof import("/Users/nyxynyx/test/node_modules/moment/ts3.1-typings/moment.d.ts")) | Daterange | undefined'.
Type 'Date[]' is missing the following properties from type 'Moment': format,startOf,endOf,add,and 80 more.
Overload 2 of 2,'(props: Props<DaterangePicker>,context: any): DaterangePicker',gave the following error.
Type 'Date[]' is not assignable to type 'Moment | (MomentRange & typeof import("/Users/nyxynyx/test/node_modules/moment/ts3.1-typings/moment.d.ts")) | Daterange | undefined'.
Type 'Date[]' is not assignable to type 'Moment'. TS2769
20 | <DaterangePicker
21 | onChange={onChange}
> 22 | value={value}
| ^
23 | />
24 | )
25 | }
我的代码基于 official example in the package repo。
为什么这里会出现 Typescript 错误,我们该如何解决?
React Typescript 代码:
import React,{ useState } from 'react';
import DaterangePicker from 'react-daterange-picker';
export function Foo(): JSX.Element {
const [ value,onChange ] = useState([new Date(),new Date()]);
return (
<DaterangePicker
onChange={onChange}
value={value}
/>
)
}
解决方法
您从示例中更改的一行是导入。
import DateRangePicker from 'react-daterange-picker';
这一行不会导入您在问题中链接到的模块。导入 react-daterange-picker
,但您链接到 @wojtekmaj/react-daterange-picker
。这是两个完全不同的模块。
而是安装 @wojtekmaj/react-daterange-picker
并且它的类型包 @types/wojtekmaj__react-datetimerange-picker
。然后它应该像你期望的那样工作。
更改您的导入行
import DateRangePicker from 'react-daterange-picker';
到
import DateRangePicker from '@wojtekmaj/react-daterange-picker';
如果未安装软件包,则:
npm install @wojtekmaj/react-daterange-picker
希望对你有帮助。谢谢。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。