SASS Mixin 重写 & (&)

Posted 2023-02-16

【中文标题】SASS Mixin 重写 & (&)

【英文标题】：SASS Mixin Rewrite & (ampersand)

【发布时间】：2017-10-09 11:47:35

【问题描述】：

我正在尝试编写一个 mixin 来修改输出时的父选择器。这个想法是，在调用 mixin 的情况下，父选择器将需要对其进行字符串替换。我有大部分工作，但我不知道如何吞下&。

.test 
  @include alt_parent() 
    content: 'test';
  

mixin 是这样的：

@mixin alt_parent() 
  #str-replace(unquote("#selector_append(&)"), "s", "x") 
    @content;
  

我有字符串替换工作，所以这不是问题。我得到的是这个（我明白为什么）：

.test .text 
  content: 'test';

我想要的是这个：

.text 
  content: 'test';

【参考方案1】：

您必须使用@at-root 指令来阻止自动包含由& 表示的选择器。

http://alwaystwisted.com/articles/2014-03-08-using-sass-33s-at-root-for-piece-of-mind

@mixin alt_parent($parent) 
    @at-root 
        #str-replace(unquote("#selector_append(&)"), "s", "x") 
            @content;