React Router官网Tutorial解读(v6)

93 阅读1分钟

1、将App和浏览器url建立连接

image.png

2、添加一些超链接Link进行url跳转

image.png

3、添加一些routes路由

image.png

image.png

4、嵌套路由

image.png

image.png

5、列表渲染link

image.png

image.png

image.png

6、添加不匹配路由

image.png

7、动态路由与读取URL参数

image.png

image.png

image.png

image.png

8、默认路由

image.png

image.png

9、NavLink

image.png

以回调函数的形式编写属性,回调函数会传入对象,里面有isActive属性表示当前Link是否活跃

image.png

10、Search Params读取query参数

image.png

image.png

image.png

11、自定义行为useLocation

image.png

image.png

image.png

image.png

12、编程式导航useNavigation

image.png

image.png