Security type on reacting router. Route parameters possible?

Can I safely access Route Routa 2.0 w / TypeScript properties? For example:

<Router> <Route path="/" component={App}> <Route path="screenOne" header="Screen One" component={ScreenOne}/> </Route> </Router> 

The value of the screenOne Route header can be obtained through 'this.props.route.header', but it is not possible to set and install it using TypeScript without receiving warnings that the property doesnโ€™t exist on the route side or inside the component that accesses to this property. I looked at definition files at http://definitelytyped.org/ and https://github.com/typings/typings

+7
react-router typescript
source share
1 answer

Based on the comment https://stackoverflow.com/users/2225281/aaron it seems you can do it, but it's a little dumb using the definitions from Types. Maybe someone can expand this to improve or have a better idea, but this is what I still assumed inside the routes.tsx file or the like:

 //Create a type to limit duplication and help w/refactoring type Header = string; //Interface for the injected props. Used by component via 'this.props.route.header' export interface HeaderRouteInjectedProps extends IInjectedProps { route?: IRoute & { header: Header } } //Interface and class to create a new Route type 'HeaderRoute' that requires a header property interface HeaderRouteProps extends IRouteProps { header: Header } class HeaderRoute extends React.Component<HeaderRouteProps, {}> { } 
+2
source share

All Articles