前言

每次用配置react路由都會考慮是否應(yīng)該給給<Route>組件加上exact或strict。下面妹子將于自認(rèn)為比較清晰的方式列舉出來什么場景需要加和不加。

本文案例主要以react-router v4+為主，v5版本是因為發(fā)布時版本依賴有問題而直接跳成這個大版本的,用法和4完全相同，就是這么任性 > < ，升級詳情可看本文最后鏈接

exact

exact默認(rèn)為false，如果為true時，需要和路由相同時才能匹配，但是如果有斜杠也是可以匹配上的。 如果在父路由中加了exact，是不能匹配子路由的,建議在子路由中加exact，如下所示

//父路由 <Switch><Route path="/a" component={ComponentA} /> </Switch> 復(fù)制代碼//子路由，tuanDetail組件里 <Switch><Route path="/a/b" exact component={ComponentB}/> </Switch> 復(fù)制代碼

strict

strict默認(rèn)為false，如果為true時，路由后面有斜杠而url中沒有斜杠，是不匹配的

案例

總結(jié)

如果沒有子路由的情況，建議大家配都加一個exact；如果有子路由，建議在子路由中加exact，父路由不加； 而strict是針對是否有斜杠的，一般可以忽略不配置。

其他鏈接

原文地址:raoenhui.github.io/react/2019/… reacttraining.com/react-route… reacttraining.com/blog/react-…

Happy coding .. :)

總結(jié)

以上是生活随笔為你收集整理的react-router中的exact和strict的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。