NavLink中的activeClassName已经被废除了

196 阅读1分钟

[react-router-dom中NavLink中activeClassName和className]

在我进行练习点击高亮事件的时候发现activeClassName并不能在类的后面添加另一个类,然后经过搜索发现activeClassName已经被废除了

在新的语法中,添加高亮事件

                            <NavLink className={({ isActive }) =>isActive ? "light" : ""} to="/about" >About

注意:在light前面需要添加一个空格,不然两个类名拼接在一起就不能触发高亮效果

                            <NavLink className={({ isActive }) => "list-group-item" + (isActive ? " light" : "")} to="/about" >About

需要在className中添加一个回调函数