我很茫然。我对Typescript还是很陌生,我确实尝试了在其他线程上找到的几种建议的解决方案,例如导入RouteProps
或RouteComponentProps
并将其应用于React.FC<RouteProps>
,但是{{1} },match
和params
仍然不存在。
我尝试创建一些接口,但是我不确定如何键入对象{}。因为id
和match
是对象,而params
是字符串。.
下面是我正在使用的代码。任何输入将不胜感激。
id
答案 0 :(得分:1)
当您将react-router道具RouteComponentProps
添加到组件道具时,它知道您的道具包含属性match
,其属性为params
,该属性为{{1} }。还不知道object
中存在哪些属性。
考虑一下,参数名称取决于您在路由匹配字符串中的位置,因此,参数名称是特定于路由器实现的。
类型params
带有一个generic类型参数RouteComponentProps<Params>
,它允许您指定匹配参数是什么。您可以内联或通过为道具定义接口来完成此操作:
Params
或
const Cocktail: React.FC<RouteComponentProps<{id: string}>> = (props) => {
现在,当您尝试访问interface MyParams {
id: string;
}
const Cocktail: React.FC<RouteComponentProps<MyParams>> = (props) => {
打字稿上的属性时,您的IDE将知道这些属性为props.match.params
,而没有其他内容。