reactjs - exact - react router tutorial
Aumentar el módulo de reacción-enrutador con typings react-router-relay (2)
El router de reacción predeterminado se usa como tal:
import * as React from ''react'';
import { Router, Route, hashHistory } from ''react-router'';
const routing = (
<Router history={hashHistory}>
<Route path="/login" component={Login}/>
</Router>
};
Cuando incluyo la biblioteca "reaccionar-enrutador-relevo", agrega funcionalidad al enrutador. A saber, agrega 2 propiedades al componente del enrutador (procesamiento y entorno):
import * as React from ''react'';
import * as Relay from ''react-relay'';
import * as useRelay from ''react-router-relay'';
import { Router, Route, hashHistory, applyRouterMiddleware } from ''react-router'';
const routing = (
<Router history={hashHistory} render={applyRouterMiddleware(useRelay)} environment={Relay.Store}>
<Route path="/login" component={Login}/>
</Router>
};
¿Cómo voy a aumentar las tipificaciones del router de reacción?
He intentado un montón de enfoques, siendo el último:
import { Router } from ''react-router'';
declare module ''react-router'' {
namespace Router {
export interface RouterProps {
environment?: any
}
}
}
Como necesito ampliar el espacio de nombres "Enrutador" y la interfaz "RouteProps" debajo de él.
Enlace a typings del enrutador React: https://www.npmjs.com/package/@types/react-router
La biblioteca React-router-relay no tiene ningún typings en sí mismo.
Toda la información que he encontrado sobre este tema:
- https://github.com/Microsoft/TypeScript/issues/11034
- https://github.com/typings/typings/issues/611
así que el problema parece ser que los tipings de reacción no exportan los espacios de nombres, por lo que es imposible aumentarlos
<Router history={hashHistory} render={applyRouterMiddleware(useRelay)} environment={Relay.Store}>
<Route path="/login" component={Login}/>
</Router>
Parece que el inicio de sesión (component = {Login}) no se ha importado. Por lo tanto, siempre devuelve un error.
Prueba este
declare module ''react-router'' {
interface RouterProps {
environment?: any
render?: any
}
}
está trabajando con las últimas definiciones de router de reacción.