React ROUTER之嵌套路由

第一张是需要修改router文件createBrowserRouterd参数数组中的路由关系

第二张是需要在一级路由的index.js中选择二级路由的位置

第一步是在全局的router.js文件中加入新的children属性,如图

第二步是在一级路由的index.js文件中声明outLet组件

默认二级路由

在未点击一级路由跳转二级路由的按钮时就已经将一个默认的二级路由渲染出来的操作

1.把想要的默认二级路由Path干掉

2.增加一个index属性并设置为true

并且一级路由组件的index.js也需要修改

404兜底组件




两种路由模式

相关推荐
2501_915373883 小时前
Vue 3零基础入门:从环境搭建到第一个组件
前端·javascript·vue.js
沙振宇6 小时前
【Web】使用Vue3开发鸿蒙的HelloWorld!
前端·华为·harmonyos
运维@小兵6 小时前
vue开发用户注册功能
前端·javascript·vue.js
蓝婷儿6 小时前
前端面试每日三题 - Day 30
前端·面试·职场和发展
oMMh7 小时前
使用C# ASP.NET创建一个可以由服务端推送信息至客户端的WEB应用(2)
前端·c#·asp.net
EndingCoder7 小时前
跨平台移动开发框架React Native和Flutter性能对比
flutter·react native·react.js
一口一个橘子7 小时前
[ctfshow web入门] web69
前端·web安全·网络安全
读心悦8 小时前
CSS:盒子阴影与渐变完全解析:从基础语法到创意应用
前端·css
m0_616188498 小时前
使用vue3-seamless-scroll实现列表自动滚动播放
开发语言·javascript·ecmascript
湛海不过深蓝9 小时前
【ts】defineProps数组的类型声明
前端·javascript·vue.js