使用 Tailwind css 设计 Navlink

Posted 2023-03-06

技术标签:

【中文标题】使用 Tailwind css 设计 Navlink【英文标题】：Styling Navlink using Tailwind css 【发布时间】：2021-06-22 01:38:00 【问题描述】：

我正在尝试将 tailwind-css 添加到 Navlink(react-router-dom)。我想添加积极的风格。要添加活动样式，我可以使用

<NavLink to="/faq" activeStyle=fontWeight: "bold",color: "red">
  FAQs
</NavLink>

有没有办法用tailwind-css做到这一点，我不想用css，也许是这样的？

<NavLink to="/faq" className=`$active?'font-bold text-red':'text-gray-900'...`>
  FAQs
</NavLink>

【问题讨论】：

【参考方案1】：

NavLink 组件有一个activeClassName 属性。

https://reactrouter.com/web/api/NavLink

【讨论】：

以上是关于使用 Tailwind css 设计 Navlink的主要内容，如果未能解决你的问题，请参考以下文章