react的Router的exact、path以及component属性

  • exact:Route下的一条属性,一般而言,react路由会匹配所有匹配到的路由组价,exact能够使得路由的匹配更严格一些。exact的值为bool型,为true是表示严格匹配,为false时为正常匹配。

        如在exact为true时,’/link’与’/’是不匹配的,但是在false的情况下它们又是匹配的。

<Route path='/' component={App} />
<Route path='/Home' component={Home} />
<Route path='/About' component={About} />

​//这种情况下,如果点击Home,匹配路由path='/Home',那么会把App也会展示出来。

<Route exact path='/' component={App} />
<Route path='/Home' component={Home} />
<Route path='/About' component={About} />
//这种情况,如果点击Home,匹配路由path='/Home',那么App就不会展示出来
  • path标识路由的路径,component表示路径对应显示的组件。

猜你喜欢

转载自blog.csdn.net/hehepeng123/article/details/88345174