如何使用 Tailwind CSS 和 React-Scroll 在 React 中突出显示活动导航栏

Answer 1

要为

<Link>

中的活动

react-scroll

组件设置样式，您可以使用

activeClass

属性，如下所示：

<li className="transition duration-300 ease-in-out hover:text-blue-500">
    <Link activeClass='text-white' to="contact" smooth={true} duration={300}>
      Contact
    </Link>
</li>

这会将

text-white

添加到您的活动链接组件。