React学习day07-ReactRouter-抽象路由模块、路由导航、路由导航传参、嵌套路由、默认二级路由的设置、两种路由模式
14、ReactRouter续
（2）抽象路由模块
1）新建page文件夹，存放组件
组件内容：
2）新建router文件夹，在其下创建实例
3）实例导入，使用
4）效果
（3）路由导航
1）作用：
实现路由系统中的多个路由之间需要进行路由跳转，并可能在跳转的同时进行传参的需求
2）分类
①声明式导航（通过【<Link to=”跳转的路径” />】组件跳转）（传参可直接通过字符串拼接的方式传递）
效果：
②编程式导航
（4）路由导航传参
1）searchParams传参
①传参
②获取参数（先解构，再使用）
2）params传参（传递多个参数，采取同样的步骤）
①在router中，找到需要参数的路径，使用参数名进行占位
②传参
③获取参数（通过使用useParams得到需要的params，params.参数名获取）
（5）嵌套路由
1）概念：
在一级路由中又嵌套了其他路由（比如：嵌套至一级路由内的路由称为二级路由）
2）步骤
①准备一级路由和二级路由组件
②在router中配置路由路径
③使用
④效果
点击链接，进行切换
（6）默认二级路由
1）作用：当访问一级路由时，默认的二级路由也可以得到渲染
2）步骤：
①找到router下的路由路径配置，在二级路由的位置去掉path，设置index属性为true（可以在路径为/时，显示内容）
②在一级路由的组件中修改默认二级路由组件的路径（可以实现路径的正常切换）
③效果
（7）404路由配置（路径找不到时使用）
1）准备404组件
2）在router中配置路径（在路由数组的结尾，以*为path配置路由）
3）效果
（8）两种路由模式
1）history模式（ReactRouter由createBrowerRouter创建）
①底层原理：history对象+pushState事件
②路径显示：不带#
③不需要后端支持
2）hash模式（ReactRouter由createHahRouter创建）
①底层原理：监听hashChange事件
②路径显示：带#
③需要后端支持
3）切换（在router配置路由路径中将创建实例的函数导入、替换即可）
