React-router-V6.0路由的使用

我的有道云参考文档

一、路由的介绍

React Router 是一个基于 React 之上的强大路由库，它可以让你向应用中快速地添加视图和数据流，同时保持页面与 URL 间的同步
通过react-router主要创建单页面的大型应用（SPA）

二、安装路由

先通过npx create-react-app搭建一个项目
1、在react的项目中安装路由react-router或者react-router-dom

npm install react-router-dom --save

package.json里面显示有如下表示安装成功

三、配置路由

1、index.js中引入需要的组件页面

import User from '../pages/User.js'
import Above from '../pages/Above.js'

2.index.js中通过定义route内的path和element，确定每一个路径path对应的组件element

3.在app.js中引入配置好的路由文件

到此就配置完成了，配合下面的Link跳转使用

四、Link的跳转

4.1步骤

1、在页面中引入Link

2.通过Link中的to属性设置跳转的url路径(Link被浏览器解析为a标签)