根据 & 元素类型改变 mixin 行为答案

【问题标题】：Changing mixin behavior based on & element type根据 & 元素类型改变 mixin 行为
【发布时间】：2014-08-03 12:51:55
【问题描述】：

有没有办法检查 mixin 中引用的元素类型？

有点像

.mymixin(&) when (& = 'a') {}
.mymixin(&) when (& = 'li') {}
.mymixin(&) when (& = 'div') {}

【问题讨论】：

您可以将元素类型作为参数传递给 mixin 并使用守卫，但我认为您不能使用 &。
想法是自动检测 mixin 中的元素类型。减少一些文件大小。想象一下，我们需要做类似 .list .social a, .list .social-another a i { .mixin();如果元素是“a”，则打印 &.short { color:#fff }，如果元素是“i”，则打印 &.long { color:#fff } }

【解决方案1】：

您不能将 & 父引用的值分配给变量，也不能将其用作 mixins 的参数。

同时检查CSS guards，它可以让你使用：

& when (@my-option = true) {
  button {
    color: white;
  }
  a {
    color: blue;
  }
}

【讨论】：