reactjs - TypeScript、react-router 和 jsx : JSX element type 'Route' does not have any construct or call signatures

Question

在尝试遵循此演练时获取 JSX 元素类型“Route”没有任何构造或调用签名 React Integrating Routing to Material UI’s Left Nav (or Other Components)使用 TypeScript。

我的代码:

const Routes = (
  <Route path="/" handler={Main}>
    <IndexRoute handler={ConnectionModule} />
  </Route>
);

导致 TypeScript 编译器使用上述错误消息提示 Route 和 IndexRount 导入。

这是我的导入语句(包括我自己的 es 模块)。注意从 react-router 向中间导入。

import { AppBar, Drawer, FontIcon, List, ListItem, MakeSelectable, TouchTapEvent } from 'material-ui';

import { deepOrange500 } from 'material-ui/styles/colors';
import { getMuiTheme, MuiThemeProvider } from 'material-ui/styles';

import * as React from 'react';
import { Component } from 'react';

import Router from 'react-router';
import { Route, IndexRoute, Redirect, Link } from 'react-router';


import MainState from './MainState';
import ConsoleModule from './ConsoleModule';

import ConnectionModule, { ConnectionModuleState } from './containers/ConnectionModule';

我正在使用这些版本的相关 npm 包(来自 package.json)

"material-ui": "^0.15.3",
"react": "^15.3.0",
"react-dom": "^15.3.0",
"react-router": "^2.6.1",
"react-tap-event-plugin": "^1.0.0",
"@types/material-ui": "^0.15.31",
"@types/node": "^6.0.32",
"@types/react": "^0.14.29",
"@types/react-dom": "^0.14.14",
"@types/react-router": "^2.0.30",
"typescript": "^2.1.0-dev.20160808",

相关链接:

• JSX in TypeScript
• Using react-router with typescript
• react-tsx-starter/src/app/client.tsx

Answer 1

问题出在你需要编辑的 react-router 定义文件中:将名为“_React”的旧全局命名空间更改为名为“React”的新命名空间。

这只会在使用 npm types 安装时发生。