本文的目的是讲清楚react-router如何根据浏览器中的url来渲染不同的组件的，至于url是如何改变的（Link组件）请参见下一篇react-router原理之Link跳转。 react-router提供了专门的路由匹配方法matchPath(位于packages/rea…

<Route/> 组件渲染优先级 渲染方式有如下三种: render component children 三个属性同时存在 渲染结果 只有render和component 渲染结果 因此,渲染的优先

实现路由嵌套网上可以找到各种方法，在react-router-dom3.x和4.x的时候路由的嵌套是差不多的，但在5.x的时候路由嵌套变得不一样了，这也是我踩了两天坑找到的解决方案： 这是我的reac

在项目中，嵌套路由是非常常见的。比如，后台管理系统，大部分都是使用的这种模式，来实现页面的总体划分。更加模块化。 如果项目整体都已经搭建好了，只需要安装react-router即可。 childPage文件夹中存放二级导航的组件。 Video.jsx 是二级导航栏的组件，里面需…

一 前言 不知不觉 react-router 已经到了 v6 版本了，可能很多同学发现，v6相比之前的 v5 有着翻天覆地的变化，因为最近接触到了 React 的新项目，用到了 v6 版本的 reac

本 Demo 并不采用 CSS Module 来进行 css 模块化，因为编译之后可读性不好，而且增加复杂度和编译时间。使用统一的 css 命名空间约定，我们也可以很简单的防止 css 命名冲突。 使用 Typescript 意味着使用强类型，我们把业务实体中 TS 类型定义分…

Router react-router-dom是一个处理页面跳转的三方库，在使用之前需要先安装到我们的项目中： 简单路由 使用路由时需要为组件指定一个路由的path，最终会以path为基础，进行页面的