时间戳

首页 > 解决方案 > 在 React Router 中将“activeClassName”添加到 NavLink

reactjs - 在 React Router 中将“activeClassName”添加到 NavLink

问题描述

好的，所以我有这个组件，它渲染得很好，但是我有问题，当路由改变时，activeClassName 不会动态改变 - 我需要刷新页面。

目标行为：动态更改activeClass - 无需刷新页面。

在此处输入图像描述

                  <NavLink to="/" activeClassName="activeRoute" exact={true} ><img src ={MobileIcon1}/><p>MAIN</p></NavLink>
                  <NavLink to="/cprojects" activeClassName="activeRoute"><img src ={MobileIcon2}/><p>PROJECTS</p></NavLink>
                  <NavLink to="/cabout" activeClassName="activeRoute"><img src ={MobileIcon3}/><p>ABOUT</p></NavLink>
                  <NavLink to="/articles" sactiveClassName="activeRoute"><img src ={MobileIcon4}/><p>ARTICLES</p></NavLink>

好的，我重构了代码，它现在可以工作 - 问题在于嵌套组件而不是将其连接到withRouter

标签： reactjshyperlinkreact-router

解决方案

推荐阅读