React activeClassName="active"在服务器上不工作。它在我的本地运行正常。
Navbar.js
<ul className="sidebar-elements">
<li><NavLink to="/" exact activeClassName="active">Dashboard</NavLink></li>
<li><NavLink exact to="/about" activeClassName="active">About Us</NavLink></li>
<li><NavLink exact to="/contact" activeClassName="active">Contact Us</NavLink></li>
</ul>
Routes.js
<Switch>
<Route exact path="/" component={Dashboard} />
<Route exact path="/about" component={About} />
<Route exact path="/contact" component={Contact} />
</Switch>
App.js
<div className ="App ">
<div className="contentSection">
<Navbar/>
<main id="content">
<Routes />
</main>
</div>
</div>
index.js
ReactDOM.render(<Router><App /></Router>, document.getElementById('root'));
本地输出
enter image description here
在服务器上输出
最佳答案
问题可能出在您的应用程序作为产品的子目录,如 http://yourdomain.com/your-application . 在这种情况下,您应该使用路由器的 basename属性(property)。
关于javascript - React activeClassName 在服务器上不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58319380/