V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
• 请不要在回答技术问题时复制粘贴 AI 生成的内容
Leon6868
V2EX  ›  程序员

组件化 Tailwind 传递 ClassName 参数最佳实践求解答

  •  
  •   Leon6868 · 13 天前 · 1201 次点击

    如题,假设组件 A 内部有多个子元素,我希望将 A 组件化的同时能分别配置改子元素的 ClassName ,请问怎样设计组件 A 比较好?

    6 条回复    2025-02-09 18:19:15 +08:00
    XCFOX
        1
    XCFOX  
       13 天前
    可以参考 HeroUI ,给最外面层组件加一个 classNames 属性来传递子组件的 className

    https://www.heroui.com/docs/components/card#slots
    inewsk
        2
    inewsk  
       13 天前
    props 传名为 classNames 的物件,键值是组件和子组件的样式属性

    https://mantine.dev/styles/styles-api/

    Leon6868
        3
    Leon6868  
    OP
       13 天前
    @inewsk #2 这个思路很好!但是不使用 className 的话,无法触发 tailwind css 的 intelliSence ,请问如果我想发布组件库的话,应该怎么处理呢?
    lisongeee
        5
    lisongeee  
       13 天前
    tailwind css 的 intelliSence 是不是类似 unocss 的 strict 模式

    unocss 默认是关闭 strict 模式的,普通的 js 代码 let v = 'flex-1' 也会有 unocss 代码提示
    amlee
        6
    amlee  
       13 天前 via Android
    tailwind 的设计思路不是做这种事的吧?你这个场景不是应该传递 props 下去吗?
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2520 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 23ms · UTC 11:02 · PVG 19:02 · LAX 03:02 · JFK 06:02
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.