TypeScript、react-router 和 jsx：JSX 元素类型 'Route' 没有任何构造或调用签名

Posted 2023-02-21

【中文标题】TypeScript、react-router 和 jsx：JSX 元素类型 \'Route\' 没有任何构造或调用签名

【英文标题】：TypeScript, react-router and jsx: JSX element type 'Route' does not have any construct or call signaturesTypeScript、react-router 和 jsx：JSX 元素类型 'Route' 没有任何构造或调用签名

【发布时间】：2016-12-23 03:03:24

【问题描述】：

在尝试使用 TypeScript 遵循此演练 React Integrating Routing to Material UI’s Left Nav (or Other Components) 时获取 JSX element type 'Route' does not have any construct or call signatures。

我的代码：

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

【参考方案1】：

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

这只发生在使用 npm 类型安装时。