我正在使用语义ui react ,并且我正在使用NavLink和Menu.Item进行路由。
下面是我的导航栏组件:
const Navbar = () => (
<div>
<Container>
<Menu secondary stackable widths={4}>
<Menu.Item>
<img src={Logo} alt="header" />
</Menu.Item>
<Menu.Item as={NavLink} to="/" name="home">
<Icon name="home" size="large" />
<p>Home</p>
</Menu.Item>
<Menu.Item as={NavLink} to="/data" name="data">
<Icon name="dashboard" size="large" />
<p>Dashboard</p>
</Menu.Item>
<Menu.Item as={NavLink} to="/user" name="user">
<Icon name="user" size="large" />
<p>User</p>
</Menu.Item>
</Menu>
</Container>
</div>
);
现在这就是问题所在。路由工作正常,但由于某种原因,“主页”菜单项始终处于事件状态。
但是其他两条路线工作正常(即仅在路线正确时才设置为“事件”)
Here is what it looks like with /dashboard route active
我的 App.jsx 中的路由代码:
<Switch>
<Route exact path="/" component={Home} />
<Route path="/data" component={Dashboard} />
<Route path="/user" component={User} />
</Switch>
上面的照片应该可以清楚地表明问题!
如有任何意见,我们将不胜感激!!
最佳答案
可以从上面的 AngelSalazar 确认,这修复了它。谢谢!
<Menu.Item as={NavLink} exact to="/" name="home">
关于reactjs - Menu.Item NavLink 始终处于事件状态的问题 Semantic UI React,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49395364/