Sass：使用`class。＆amp;`生成嵌套的根类

Question

我不明白为什么以下代码生成.test a.test {color: black;}
而是预期a.test {color: black;}？
我认为它是&.a的一种相反的方法，它只生成test.a（在这种情况下）。

.test {
  width: 10px;
  a#{&} {
    color: black;
  }
}

Answer 1

我刚刚找到了a.test样式的解决方案，其中a类嵌套在.test中。
有一个特殊的sass指令@at-root允许在列表的根目录下发出一个样式块。

// Sass
.test {
  @at-root a#{&} {color: blue;}
}

// Generated CSS
a.test {color: blue;}

Demo