TypeScriptを使用してreact-router2.0ルートプロパティに安全にアクセスすることは可能ですか?例えば:
<Router>
<Route path="/" component={App}>
<Route path="screenOne" header="Screen One" component={ScreenOne}/>
</Route>
</Router>
screenOneルートのヘッダー値には「this.props.route.header」を介してアクセスできますが、プロパティがどちらにも存在しないという警告を受け取らずに、それを設定してTypeScriptを使用してアクセスすることはできないようです。プロパティにアクセスするコンポーネントの側面または内部をルーティングします。http://definitelytyped.org/とhttps://github.com/typings/typingsの両方の定義ファイルを調べました。
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, {}> { }
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加