嵌套的路由中，子级的Link跳转到父级时，页面无法整个渲染到父级。

原因：某一级的路由用了Router组件，导致内部Link的时候无法将整个页面渲染到“/”

解决方法：全局一个Router。

子级的兄弟路由无法匹配

原因：顶层路由<Route>用了exact，导致最开始的‘/about’无法匹配到’/about/sth‘，由于上一级路由中about被限定在/about,一旦路由到/about/xx，about页面不会渲染，导致页面不显示。

解决方法：某个路由底下有嵌套路由时，不要加exact，不要加exact，不要加exact

react-router 4v 路由嵌套问题的更多相关文章

  1. 从 React Router 谈谈路由的那些事

    React Router 是专为 React 设计的路由解决方案,在使用 React 来开发 SPA (单页应用)项目时,都会需要路由功能,而 React Router 应该是目前使用率最高的. Re ...

  2. React Router 4.0 ---- 嵌套路由和动态路由

    嵌套路由,从广义上来说,分为两种情况:一种是每个路由到的组件都有共有的内容,这时把共有的内容抽离成一个组件,变化的内容也是一个组件,两种组件组合嵌套,形成一个新的组件.另一种是子路由,路由到的组件内部 ...

  3. react router 4.0以上的路由应用

    thead>tr>th{padding:8px;line-height:1.4285714;border-top:1px solid #ddd}.table>thead>tr& ...

  4. React 实践记录 03 React router

    Introduction 本文主要参考了react router 的官方文档. React Router是一套完整的配合React的路由解决方案,可能你已经知道前端路由,或者知道后端有路由的概念,如下 ...

  5. React Router v4 页面传值的三种方法

    传值方法 1.props.params 使用React router定义路由时,我们可以给指定一个path,然后指定通配符可以携带参数到指定的path: <Route path='/user/: ...

  6. React初识整理（四）--React Router(路由)

    官网:https://reacttraining.com/react-router 后端路由:主要做路径和方法的匹配,从而从后台获取相应的数据 前端路由:用于路径和组件的匹配,从而实现组件的切换. 如 ...

  7. < react router>: (路由)

    < react router> (路由): 思维导图: Atrial   文件夹下的index.js 文件内容: import React, { Component } from 'rea ...

  8. react router @4 和 vue路由 详解(七)react路由守卫

    完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html 12.react路由守卫? a.在之前的版本中,React Router 也提供了类似的 ...

  9. react router @4 和 vue路由 详解(全)

    react router @4 和 vue路由 本文大纲: 1.vue路由基础和使用 2.react-router @4用法 3.什么是包容性路由?什么是排他性路由? 4.react路由有两个重要的属 ...

随机推荐

  1. Querying for Event Information

    https://docs.microsoft.com/zh-cn/windows/desktop/EventLog/querying-for-event-source-messages #includ ...

  2. Iterator to list的三种方法

    目录 简介 使用while 使用ForEachRemaining 使用stream 总结 Iterator to list的三种方法 简介 集合的变量少不了使用Iterator,从集合Iterator ...

  3. mac OS 搭建PHP项目开发环境

    系统 macOS Mojave 版本10.14.6 mac OS 自带Apache和PHP 非常便利 sudo apachectl -v //查看apache版本 php -v //查看php版本 启 ...

  4. php private学习笔记

    类的权限修饰符,放在属性/方法的前面.用来说明属性/方法的权限特点. 三种权限修饰符 private  私有的 public   公共 protected  保护的 privata 的属性.方法只能在 ...

  5. 使用react脚手架create-react-app创建react应用

    Create React App是一种官方支持的创建单页React应用程序的方法.它提供了一个没有配置的现代构建设置. 一.全局安装脚手架: npm install -g create-react-a ...

  6. 老男孩教育每日一题-2017年3月29日-使用ifconfig取出网卡eth0的ip地址-看看你有多少方法...

    方法1:sed命令 [root@oldboyedu ~]# ifconfig eth0 |sed -n '2p' |sed's#^.*addr:##g'|sed 's#  B.*$##g' 10.0. ...

  7. Boostrap Table学习笔记

    最近要对项目上的table进行调整,让表格能够支持更多的操作,于是接触到了boostrapTable这个插件.研究了一天,记录下学习的内容. Boostrap Table可以支持表的分页及动态显示表的 ...

  8. Frame Relay Voice Traffic Shaping and Frament

    本文全称应该是:Frame Relay Voice-Adaptive Traffic Shaping and Fragmentation,标题限制字数,没办法了   帧中继的流量整型向来是个头疼的地方 ...

  9. bind()函数的深入理解及两种兼容方法分析

    在JavaScript中,bind()函数仅在IE9+.Firefox4+.Chrome.Safari5.1+可得到原生支持.本文将深入探讨bind()函数并对两种兼容方法进行分析比较.由于本文将反复 ...

  10. 数学--数论--hdu 5878 I Count Two Three（二分）

    I will show you the most popular board game in the Shanghai Ingress Resistance Team. It all started ...