时间戳

首页 > 解决方案 > 尝试导入错误：“Switch”未从“react-router-dom”导出

reactjs - 尝试导入错误：“Switch”未从“react-router-dom”导出

问题描述

我不知道为什么会收到此错误，也无法在任何地方找到答案。我已经卸载了react-router-dom软件包并重新安装了它，但它仍然告诉我交换机模块不是从 react-router-dom 导出的。这是我的代码。

我得到的错误：

尝试导入错误：“Switch”未从“react-router-dom”导出。

代码

import React from 'react';
import './App.css';
import NavBar from './components/navbar.js';
import Footer from './components/footer.js';
import Home from './components/pages/homepage/home.js';
import { BrowserRouter as Router, Switch, Route, Link } from 'react-router-dom';

function App() {
  return (
    <Router>
      <div className="app-container">
        <NavBar />
        <Switch>
          <Route path="/home" component={Home} />
        </Switch>
        <Footer />
      </div>
    </Router>
  );
}

export default App;

标签： reactjs

解决方案

在react-router-dom v6 中，“Switch”被路由“Routes”取代。您需要从

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

至

import { Routes ,Route } from 'react-router-dom';

您还需要更新 Route 声明

<Route path="/" component={Home} />

至

<Route path='/welcome' element={<Home/>} />

在react-router-dom中，您也不需要在 Route 声明中使用确切的。

更多信息可以访问官方文档： 升级到react-router-dom v6

推荐阅读