css - 有没有办法在 sass 的地图中存储 mixins

Question

我想根据条件包含不同媒体查询的类。

我现在在做什么：

@mixin available($exclude-exp: each)
{
  @if($exclude-exp == each) {
    //include for each breakpoint
  }
  @else if($exclude-exp == global-only) {
    .available {
      flex:  1
    }
  }
  @else if($exclude-exp == medium-only) {
    @media screen and (min-width: $medium) {
      .onmedium-available {
        flex: 1
      }
    }
  }
  .
  .
  .
}

如果availablemixin$exclude-exps作为地图接收并循环遍历地图，然后在该地图中包含所有 mixin，那对我来说会更好。

@mixin available($exclude-exps) {
  @each $exclude-exp in $exclude-exps {
    @include $exclude-exp();
  }
}

$exclude-exps:(
  each: @mixin() {
    //a mixin to include for each breakpoint
  },
  global-only: @mixin() {
    .available {
      flex: 1
    }
  },
  medium-only: @mixin() {
    @media screen and (min-width: $medium) {
      .onmedium-available {
        flex: 1
      }
    }
  },
  .
  .
  .
)

然后我可以添加任意数量的字母$exclude-exps。

标签： csssassmedia-queriesmixinsscss-mixins