React router dom with Typescript using match

Question

我正在使用React路由器Dom版本5与React v 17和TypeScript。我想弄清楚如何使用match对象。到目前为止，我有:

import { BrowserRouter, Route, Switch, match } from 'react-router-dom';

interface DetailsProps {
match?: match<string> ;
}
const Routing: React.FunctionComponent<DetailsProps> = (props: DetailsProps) => {
const match = props.match;
// more routes here
<Route path={`${match.url}`} render={() => <Component/>} />
}

I get there error: Object is possible 'undefined'.

知道为什么吗?是打错了吗?

Answer 1

可以导入:

import { match } from 'react-router-dom';

Answer 2

你的界面说match是一个可选参数，可以是undefined

interface DetailsProps {
match?: match<string> ;
}

通过删除?标记，您将使其必需:

interface DetailsProps {
match: match<string> ;
}