Question

默认的react-router用作：

import * as React from 'react';
import { Router, Route, hashHistory } from 'react-router';

const routing = (
    <Router history={hashHistory}>
        <Route path="/login" component={Login}/>
    </Router>   
};

当我包含“react-router-relay”库时，它会为路由器添加功能。即它为路由器组件（渲染和环境）添加了2个属性：

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>   
};

我将如何增加反应路由器的类型？

我尝试了一系列方法，最新的是：

import { Router } from 'react-router';

declare module 'react-router' {
    namespace Router {
        export interface RouterProps {
            environment?: any
        }
    }
}

因为我需要扩展名称空间“Router”和它下面的“RouteProps”接口。

链接到React路由器类型：https://www.npmjs.com/package/@types/react-router

React-router-relay库本身没有任何类型。

我发现的有关此主题的所有信息：

https://github.com/Microsoft/TypeScript/issues/11034
https://github.com/typings/typings/issues/611
所以问题似乎是反应类型不会导出命名空间所以不可能增加它们

Answer 1

试试这个

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

它正在使用最新的react-router定义。

Answer 2

<Router history={hashHistory} render={applyRouterMiddleware(useRelay)} environment={Relay.Store}>
    <Route path="/login" component={Login}/>
</Router>

看起来登录（component = {Login}）不是Imported.Hence，它总是返回错误。

使用react-router-relay类型扩充反应路由器模块

2 个答案: