这种混入是​​什么意思？

Question

在一个scss文件中，我看到了以下代码片段：

@mixin myMixin() {
    :global(.rtl) & {
        @content;
    }
}

我能同时理解关键字@mixin和@content，并尝试通过以下链接来了解:global()：  What does :global (colon global) do?。

但是我不确定“＆”在这里做什么或整个mixin在做什么。

Answer 1

＆符是嵌套中使用的组合器，在这种情况下，它用于限定选择器。

作为一般示例：

// This Sass...
.foo {
  .bar & {
    color: red;
  }
}

// ...would compile to this CSS
.bar .foo { color:red; }

在您的示例中，mixin声明替换了.foo，如下所示：

// If you called your mixin at .bar
.bar {
  @include myMixin {
    color: red;
  }
}

// It should compile to something like this
:global(.rtl) .bar { color: red; }

有关ampersands and qualifying selectors in this CSS Tricks article的更多详细信息。