修复“‘Switch’ is not exported from ‘react-router-dom'” 错误的一种方法是将<Switch>替换为<Routes>。 让我们来看一个示例,看看如何将路由代码从 React Router 版本 5 中已废弃的<Switch>组件更新为 React Router 版本 6 中的新<Routes>组件。 在React Router 版本 5 中: import{BrowserRouterasRouter...
首先进入项目目录,使用npm安装react-router-dom: npm install react-router-dom --save-dev //这里可以使用cnpm代替npm命令 基本操作 然后我们新建两个页面,分别命名为“home”和“detail”。在页面中编写如下代码: import React from 'react'; export default class Home extends React.Component { render() { re...
在package.json 文件中添加了 react-router-dom 依赖项。由 BrowswerRouter 包装的应用程序组件,但是当我通过 switch 包装路由时,它说以下错误 Switch’ is notexported from ‘react-router-dom’。我删除了 package.json.lock 节点模块,再次安装 npm 并 npm install @babel/core –save。还是行不通。我成功地...
针对您提出的“attempted import error: 'switch' is not exported from 'react-router-dom'”问题,我可以为您提供以下解决方案: 确认'react-router-dom'版本是否支持'switch': 在react-router-dom的v5版本中,Switch组件是存在的,用于渲染与当前URL匹配的第一个<Route>。但在react-router-dom的v6版本中...
import {BrowserRouter,Switch,Route} from "react-router-dom"; import './style/index.scss' // 引入自定义好的组件 import Header from "./component/Header"; import Swiper from "./component/Swiper"; import Foot from "./component/Foot";
‘Switch‘ is not exported from ‘react-router-dom‘ Switch 在新的版本中,不能用了 说是变成了Routes,于是我把代码这样调整: import React from 'react' import { BrowserRouter as Router,Route,Routes} from 'react-router-dom'; import history from '@/components/history/History.js' ...
Attempted import error: 'Switch' is not exported from 'react-router-dom'. 原因是在 react-router-dom 6.0以后 Switch 就不用了 在package.json 中看了一下版本: 修改成为: <RouterinitialEntries={['/home']}> <Routes> <Routeexactpath='/home'component={Home}/> ...
在React路由配置中,根路径(/)是一个特殊的路由。当我们只写一个斜杠(/)时,它会匹配根路由。例如,下面是一个简单的路由配置: importReactfrom'react';import{BrowserRouterasRouter,Route}from'react - router - dom';importHomefrom'./Home';importNewsfrom'./News';functionApp(){return(<Router><Route path...
报错提示:'Switch' is not exported from 'react-router-dom'. 原因分析:因为最新版本的react-router-dom@v6版本已经将Switch替换成了Routes了,所以报错了。 解决方法 1.使用Routes替换Switch 2.卸载最新版本安装@v5版本就可以继续使用Switch了 发布于 2021-12-30 14:59 ...
react学习---switch的使用 1.通常情况下,path和component是一一对应的关系。 2.Switch可以提高路由匹配效率(单一匹配)。 Switch只显示匹配到的第一个路由 import React,{Component} from 'react'; import {HashRouter as Router,Route,Link,Switch } from'react-router-dom';...