在 React 打字稿中设置路由器的问题答案

【问题标题】：Issues setting up a router in React typescript在 React 打字稿中设置路由器的问题
【发布时间】：2021-12-31 10:40:59
【问题描述】：

我在 typescript 中设置了多个路由器，但现在在一个新项目中由于某种原因我不能这样做

import React from 'react';
import Container from './Components/Containers/Meplex';
import { Switch, Route, Redirect } from 'react-router';

const App: React.FC = function () {
  return (
    <Switch>
      <Route path="/" component={Container} exact />
      <Route path="/" render={() => <Redirect to="/" />} />
    </Switch>
  );
};

export default App;

我一直都是这样用的

但现在我得到了

模块 '"react-router"' 没有导出的成员 'Redirect'。模块 '"react-router"' 没有导出成员 'Switch'.ts

键入'{路径：字符串；成分：FC；准确的：真实的； }' 不是可分配给类型 'IntrinsicAttributes & (PathRouteProps | LayoutRouteProps |索引路由属性）'。属性“组件”不存在于类型 'IntrinsicAttributes & (PathRouteProps | LayoutRouteProps | IndexRouteProps)'.ts(2322)

我在其他打字稿项目中没有这些问题

【问题讨论】：

标签： reactjs typescript react-router

【解决方案1】：

Switch 和 Redirect 是来自 react-router-dom 的模块

所以，安装react-router-dom 然后，

import { Switch, Route, Redirect } from "react-router-dom";

【讨论】：