SCSS结合：悬停和@if

Question

是否可以将以下代码组合在一起并使用：hover选择器和@if语句？

$active: true;

button {
  &:hover {
    color: red;
  }

  @if $active {
    color: red;
  }
}

这是我想做的事情：

button {
  &:hover,
  & @if $active {
    color: red;
  }
}

提前致谢。

Answer 1

您实际上可以使用$var: if();实现此目的。它可能看起来像这样：

$target: if(true, "&", "");

a { 
  &:hover,
  #{$target} {
    color: black;
  }
}

此处if()的更多信息：http://thesassway.com/news/sass-3-3-released#if