react-router v4.0+ 找不到的路由怎么handle

最新推荐文章于 2024-12-08 10:15:52 发布

原创最新推荐文章于 2024-12-08 10:15:52 发布 · 438 阅读

0 ·

CC 4.0 BY-SA版权

react-router 专栏收录该内容

3 篇文章

订阅专栏

本文讨论了在React路由器中处理路由错误的方法，当输入的路径不存在时，如何让其跳转到首页或显示404页面。通过将默认组件设置在Switch标签的最后，可以有效地解决这一问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

            <Switch>
                <Route path="/" exact component={Download}/>
                <Route path="/download" component={Downloads}/>
                <Route component={Download}/>
            </Switch>

路由输错了，希望他跳回首页或者 404页面；那么写在最后，不写path，直接匹配component即可

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

newBunny

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

React Router V7使用详解

xiangzhihong8的专栏

04-20

514

React Router（三）

lqiqil的博客

04-13

239

。

参与评论您还未登录，请先登录后发表或查看评论

react-router-dom当用户访问的路由不存在 404页面配置

weixin_45966674的博客

11-03

622

不需要知道这三个组件的内容只需要知道当用户访问的路由不存在时就会自动进入path='*'指向的路由中。当我们输入一堆乱七八糟不存在的东西时就会自动进入这个404界面也就是 path='*'对应的组件了。运行代码我们点击首页则进入首页。点击详情则进入详情。

React/Router

09-03

766

React Router 一个针对React而设计的路由解决方案、可以友好的帮你解决React components 到URl之间的同步映射关系。概览在阐明React Router可以帮你解决的问题之前我们来举一个没有引用React Router 的简单例子。没使用 React Router var About = React.createClass({ render: fun

React在路由表里引入页面，找不到模块 xxxx 或其相应的类型声明。

m0_62253070的博客

08-07

317

React在路由表里引入页面，找不到模块 xxxx 或其相应的类型声明。

react中路由和按需加载问题

Frank的博客

12-23

6203

react中路由和按需加载问题1 基本的路由设置react-router可以解决路由问题，只需要添加[基于react-router4.x]yarn add react-router-dom然后在index.js中引入它，使用:import {Link,BrowserRouter,Switch, Route} from 'react-router-dom'; ReactDOM.render((

router

spfLinux的博客

01-15

304

var Login=Vue.component('login-component',{ methods:{ handleClick:function(){ this.$router.push('/myRegister'); } }, template:` 这是登录界面注册注册 ` });

React路由react-router-dom鉴权以及网页标题

12-08

495

react 路由有三种写法：传统组件法、useRoutes 法、data Router 法。

React_Router6 详解

zhouang1的博客

10-18

1313

React Router 的 API 在它的官方文档上已经介绍得比较清楚了，我们这里简单地总结一下几个可能用到的 API。

React Router（二）

lqiqil的博客

04-07

123

。

超超详细ReactRouter v6版本的基本使用

qq_45679015的博客

03-27

4479

先附上官网的地址：react-router-v6 · GitHub Topics · GitHub 一.概述 React Router 以三个不同的包发布到 npm 上，它们分别为： react-router: 路由的核心库，提供了很多的：组件、钩子。 react-router-dom: 包含react-router所有内容，并添加一些专门用于 DOM 的组件，例如<BrowserRouter>等。 react-router-native: ..

React Router - 404路由配置

听海边涛声

07-30

531

React Router - 404路由配置

react组件获取不到路由信息

qq_43477721的博客

01-20

1115

添加如下的代码 import { withRouter } from "react-router-dom" // ..... export default withRouter(AuthRoute) 之前是使用 @withRouter 这样的装饰器，但是项目一直报错 Support for the experimental syntax ‘decorators-legacy’ isn’t currently enabled 网上百度了很久，没办法解决。后来就采用这个方法，效果是一样的 import a

webpack-dev-server搭配react-router找不到资源文件的问题解决

Michael_Li的博客

01-24

2204

最近使用webpack3 + react-router4开发一个小项目, 发现使用BrowserRouter时进入到二级url, 如从localhost:8080/ 进入到 localhost:8080/background时本来的资源文件会找不到. 问题的解决方法是所有的资源文件都使用绝对路径, 因为在webpack.config.js配置的是:devServer: { // 本地服务

react router 配置404页面

张啸-前端小师

07-18

7555

react router 配置404页面使用Vue相关的技术栈2年左右了，在路由管理上一直用的比较得心应手，现在的项目使用react开发，路由自然也就切换到了react router，所用版本为react router 4 在Vue router配置中，我们可以很简单的配置出404页面使用通配符 * 号匹配所有路由，并将此配置放在数组的最末端，当前面的路由都匹配不上时，就会匹配到 * 号，然后...

React多级路由

qq_41619567的博客

07-20

5915

正常路由 app.js页面 import React, { Component } from 'react'; import '../styles/App.css'; import '../styles/reset.css'; import '../styles/rem.js'; import {Routers} from '../router/router.js' class App ...

iOS 撸一个简单路由Router

iOS_开发

09-26

832

程序员大咖点击右侧关注，免费进阶高级！作者：changsanjianghttps://www.jianshu.com/p/13c42f4e9af1平常开发中用户点击头像，...

react一看就会的简单路由设置

weixin_41421227的博客

07-01

8873

不管是vue还是react 这种单页面的框架一定都少不了路由下面给大家讲讲在实际项目中react的路由设置第一步：在src目录下新建一个目录route 在该目录下新建一个index.js用于管理路由如:import React ,{ Component } from 'react'import {Switch,Route,Redirect} from 'react-router...

react-router路由地址变了页面却没有跳转的解决办法