导航链接激活后，如何在导航链接中设置元素样式？

Question

如何在<li>内设置<NavLink>元素的背景

<ul>
            <NavLink  activeStyle={{backgroundColor: '#fff', fontSize: '19px'}} exact to="">
                <li>Home</li>
            </NavLink>
           
            <NavLink activeStyle={{backgroundColor: '#fff', fontSize: '19px'}} exact to="/about">
                <li>About</li>
            </NavLink>
            <NavLink activeStyle={{backgroundColor: '#fff', fontSize: '19px'}} exact to="/contact">
                <li>Contact</li>
            </NavLink>
        </ul>

现在我一直在尝试使用activeStyle，但对我来说并不好，因为它可能设置了<a>标签的样式。您可以使用<li>活动样式来设置<NavLink>标签的背景样式，还是可以解决此问题？

提前谢谢

Answer 1

您可以使用 activeClassName 属性：

<NavLink to="/faq" activeClassName="selected">
  ...
</NsvLink>