react笔记之路由--路由匹配规则

责编:menVScode 2017-08-13 22:18 阅读(705)

        路由匹配规则,路由是怎么匹配到的?

        react-router里可以通过Route的两个属性:exact、strict来匹配。        

<Route path='/' component={App} />
<Route path='/aaa' component={Aaa} />

        如果地址是 localhost:9003/,那么这个路劲匹配了两个Route,也会渲染两个组件。这样设计也有其道理的,这种方式加叫通过设计,比如访问某个路劲的页面,其既有导航栏又有侧边栏,这个时候可以运用这种方式来实现。但有时候不想让它这样匹配,可以通过设置exact、strict来实现。

        exact

<Route exact path="/one" component={About}/>
 path location.pathname 布尔值是否匹配 
 /about  /about/1 true no
 /about  /about/2 false yes


        strict

<Route strict path="/about/" component={About}/>
 path location.pathname 是否匹配
 /about/ /aboutno 
 /about//about/1 yes 
 /about// about/2    yes 




标签: 路由 react Route
前端交流群: MVC前端网(menvscode.com)-qq交流群:551903636

邮箱快速注册

忘记密码