SASS - 变量参数的默认值

Question

Sass 3.2中添加了变量参数.

@mixin hello($arguments...) {
    property: $arguments;
}

//Usage:
@include hello(1);
@include hello(1, 2, 3);
@include hello(1, 2);

但是,此参数不接受默认值,如此 ($args...: default-value)

现在,我正在使用此代码,但有更好的方法吗？

@mixin transition($values...) {
    $values: null !default;

    @if $values == null {
        $values: all 0.3s ease;
    }

    -webkit-transition: $values;
    -moz-transition: $values;
    -ms-transition: $values;
    -o-transition: $values;
    transition: $values;
}

Answer 1

您的解决方案不起作用.当没有参数使用时,例如

.foo { @include transition; }

该transition混入返回一个错误:

() isn't a valid CSS value.

可以使用length()函数将变量参数视为列表.我建议这个解决方案:

@mixin transition($values...) {

  // Setting the default value
  @if length($values) == 0 {
    $values: all 0.3s ease;
  }

  -webkit-transition: $values;
  -moz-transition: $values;
  -ms-transition: $values;
  -o-transition: $values;
  transition: $values;
}

演示:http://sassbin.com/gist/5867258/

PS all和ease是默认值,所以默认值可以简化为$values: 0.3s.