我试图通过将颜色值作为 prop 传递给组件来更改上边框的颜色，但它没有产生任何效果。
我在找解决办法。请帮帮我！
export default function TargetsProgressInfo(props) {
return (
<ul>
<span className={` after:border-[7px] after:w-4 ${props.colorTip} after:border-b-transparent`}></span></li>
</ul>
</div >
)
}
**home.jsx**
<TargetsProgressInfo colorTip="after-border-t-red-600"/>
2条答案
按热度按时间olqngx591#
解决方案是将Tailwind CSS的完整名称作为 prop 传递
yzuktlbb2#
你可以使用border-t-{color}实用类。你也可以使用after伪类在元素渲染后添加边框。
然后，可以将所需颜色作为 prop 传递给组件：
这将在组件的li元素中添加一个7 px的红色600上边框。