1、严格匹配
1、react默认是模糊匹配
什么是模糊匹配,我们来看下面两个小例子
2、怎么开启严格匹配
在注册路由中添加exact或者exact={true}
1.默认使用的是模糊匹配(简单记:【输入的路径】必须包含要【匹配的路径】,且顺序要一致)
2.开启严格匹配:<Route exact={true} path="/about" component={About}/>
3.严格匹配不要随便开启,需要再开,有些时候开启会导致无法继续匹配二级路由
2、Redirect
刚启动项目的时候会进入http://localhost:3000/这个时候/about和/home都没匹配,如下图:
如果希望项目一开启默认进去/home怎么办呢?这个时候我们可以使用Redirect组件
1.一般写在所有路由注册的最下方,当所有路由都无法匹配时,跳转到Redirect指定的路由
2.具体编码:
<Switch>
<Route path="/about" component={About}/>
<Route path="/home" component={Home}/>
<Redirect to="/about"/>
</Switch>
3、Replace
当点击消息1然后点消息2的时候,从消息2可以回退到消息1
如果不希望回退呢?
- 在路由链接中添加replace或者replace={true}
这样这个链接被点击的时候,就不再是用的push进栈而是replace代替栈顶元素
参考链接: