reactjs - exact - react router tutorial

Aumentar el módulo de reacción-enrutador con typings react-router-relay

Question

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

Answer 1

<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.

Answer 2

Prueba este

declare module ''react-router'' {
interface RouterProps {
environment?: any
render?: any
}
}

está trabajando con las últimas definiciones de router de reacción.