如何在 typescript 中的 react-router Route Handler 上编写自己的属性

Question

我每晚都在使用 TS，以便能够使用 JSX 位。我也通过 definitelytyped (tsd install react-router).

使用 react-router typings

以下是主要路由处理程序的呈现：

render() {
  var name = this.context.router.getCurrentPath();
  return (
    <div>
      <RouteHandler key={name} hub={this.props.hub} state={this.state}  />
    </div>);
}

此代码部分存在一些问题：

context 已指定为 {}，没有机会修改它。 我可以fiddle那个。
我传递给 RouteHandler 的属性没有在相应的类型上指定...

error TS2339: Property 'key' does not exist on type 'RouteHandlerProp'.
...

但据我了解，以这种方式传递的属性将传递给 React 组件，由处理程序呈现。

有谁知道我可以做些什么来用 typescript 编译它？

Answer 1

context has been specified as {} without any chance to be modify it

使用粗箭头()=>。更多：https://www.youtube.com/watch?v=tvocUcbCupA

The properties I pass onto the RouteHandler are not specified on the corresponding type

TypeScript 接口是开放式的。在 vendor.d.ts 中向 RouteHandler 界面添加内容：

https://github.com/borisyankov/DefinitelyTyped/blob/5109e1269d6ab8e8e73b1a5e85d8ceb836d3099f/react-router/react-router.d.ts#L133-L146

如何在 typescript 中的 react-router Route Handler 上编写自己的属性

How to write your own properties onto react-router's RouteHandler within typescript

typescript

reactjs

react-router