No es necesario agregarlo explícitamente. En su lugar, puede usar RouteComponentProps<P> de @types/react-router como una interfaz base de sus accesorios. P es el tipo de parámetros de coincidencia.

 import { RouteComponentProps } from 'react-router'; // example route <Route path="/products/:name" component={ProductContainer} /> interface MatchParams { name: string; } interface Props extends RouteComponentProps<MatchParams> { }

 // from typings import * as H from "history"; export interface RouteComponentProps<P> { match: match<P>; location: H.Location; history: H.History; staticContext?: any; } export interface match<P> { params: P; isExact: boolean; path: string; url: string; }

Para agregar a la respuesta anterior de @ Nazar554, el tipo RouteComponentProps debe importarse desde react-router-dom e implementarse de la siguiente manera.

 import {BrowserRouter as Router, Route, RouteComponentProps } from 'react-router-dom'; interface MatchParams { name: string; } interface MatchProps extends RouteComponentProps<MatchParams> { }

Además, para permitir componentes reutilizables, la función render() le permite pasar solo lo que necesita el componente, en lugar de todo el RouteComponentProps .

 <Route path="/products/:name" render={( {match}: MatchProps) => ( <ProductContainer name={match.params.name} /> )} /> // Now Product container takes a `string`, rather than a `MatchProps` // This allows us to use ProductContainer elsewhere, in a non-router setting! const ProductContainer = ( {name}: string ) => { return (<h1>Product Container Named: {name}</h1>) }

Solución simple

 import { RouteComponentProps } from "react-router-dom"; const Container = ({ match }: RouteComponentProps<{ showId?: string}>) => { const { showId } = match.params?.showId;//in case you need to take params }