Vite 官方网址 cn.vitejs.dev/guide/
一 、 路由 react-router-dom 6+ 版本
页面创建完,再新建几个文件夹, 一般来说这几个文件夹的名字属于默认了 大家都这么语意化叫
assets: 存一些图片资源
layouts: 可以看作一个外壳, 里面随便放东西, 一会在路由那里还会说
routers: 用于集中管理路由路径
views:存放页面
还有几个文件夹需要创建, 后续再创建吧....
1、创建页面
按照这个模式创建三个页面
2、创建路由 router/index.tsx
3、使用路由 App.tsx
之后 需要在 main.tsx 用 react-router-dom 提供的 BrowserRouter 活着 HasRouter 进行包裹 才会生效
ok、 目前到这里一个简单的路由就实现了, 你可能会发现 /detail 打开的还是 /home 的页面, 是的没错, 因为 /detail 属于 /home 的子页面, 就好比, 想看 /detail 的时候 必须有 /home ,所以要在 /home 中有一个插槽去承载 /detail 的展示, react-router-dom 为我们提供了一个 Outlet
于是我们修改 /home.tsx 页面
页面展示的就是
Gitee地址: gitee.com/yuyou930615…