问个关于 react-router 的问题。

2018-07-03 10:47:04 +08:00
 lightUp

刚刚在看 router,有几个不知道的地方。

<NavLink exact replace activeClassName="active" to="/">页面 1</NavLink>
<NavLink replace to="/about">页面 2</NavLink>
<Route exact path="/" component={Home} /> 
<Route path="/about" component={About} /> 

+默认进来页面 1,并且 a 标签加上 active,如果我在 home 组件里面有嵌套路由。

<NavLink exact activeClassName="active" replace to="/home/homeChild1">嵌套路由 1</NavLink>
<NavLink activeClassName="active" replace to="/home/homeChild2">嵌套路由 2</NavLink>

<Route path="/home/homeChild1" component={HomeChild1} />
<Route path="/home/homeChild2" component={HomeChild2} />

+现在点击了嵌套路由,上面按钮的 active 就没有了,请问要怎么让嵌套路由的第一个默认显示,并且加上 active,而且上一级的路由 active 同时存在呢?

1105 次点击
所在节点    问与答
3 条回复
huijiewei
2018-07-03 11:12:40 +08:00
主路由的 exact 去掉
huijiewei
2018-07-03 11:12:58 +08:00
PS: 不能编辑,是主 NavLink 的
lightUp
2018-07-03 11:18:11 +08:00
@huijiewei 去掉的确 active 同时存在了,但是主路由里点击其他的 NavLink 时,不会切换 active 了

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/467712

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX