主页 / coding / 问题 / 79351860
Accepted
rkuang25
Asked: 2025-01-13 18:25:52 +0800 CST

Tailwind 中与样式化组件波浪符号 (~) 对应的是什么？

  • 772

我该如何编写此样式组件的 Tailwind 等效版本？

// Item is a div
const Clone = styled(Item)`
  ~ div {
    transform: none !important;
  }
`;

这来自codesandbox。当从右列拖动时，它可以防止在拖动开始时看起来像插入了额外的元素（克隆）。

css

1 个回答

  1. Best Answer

    波浪号是CSS 语法，而不是样式组件特有的。因此，你可以在Tailwind 任意变体中使用它，例如[&~div]:!transform-none。你也可以完全规避对它的需要，例如!transform-none仅在严格需要时应用，例如：

    <div className={snapshot.isDragging ? '!transform-none' : ''}
    • 2

相关问题