Question

是否可以安全地访问具有TypeScript的react-router 2.0路由属性？例如：

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

可以通过'this.props.route.header'访问screenOne Route的标题值，但似乎无法设置并使用TypeScript访问它而不会收到该属性不存在的警告在路径侧或访问该属性的组件内部。我查看了http://definitelytyped.org/和https://github.com/typings/typings

中的定义文件

Answer 1

根据https://stackoverflow.com/users/2225281/aaron的评论，您似乎可以这样做，但使用Typings中的定义有点傻。也许有人可以扩展这个以改进或有更好的想法，但这是我到目前为止假设在routes.tsx文件或类似内容：

//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, {}> { }

在反应路由器上键入安全路由可以使用路由器吗？

1 个答案: