• 请不要在回答技术问题时复制粘贴 AI 生成的内容
Leon6868
V2EX  ›  程序员

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

  •  
  •   Leon6868 · Feb 9, 2025 · 2866 views
    This topic created in 638 days ago, the information mentioned may be changed or developed.

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

    6 replies  •  2025-02-09 18:19:15 +08:00
    XCFOX
    XCFOX
    Feb 9, 2025
    1
    可以参考 HeroUI ,给最外面层组件加一个 classNames 属性来传递子组件的 className

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

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

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

    unocss 默认是关闭 strict 模式的,普通的 js 代码 let v = 'flex-1' 也会有 unocss 代码提示
    amlee
    amlee
    Feb 9, 2025 via Android
    6
    tailwind 的设计思路不是做这种事的吧?你这个场景不是应该传递 props 下去吗?
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Privacy   ·   Solana   ·   581 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 30ms · UTC 22:45 · PVG 06:45 · LAX 14:45 · JFK 17:45
    ♥ Do have faith in what you're doing.