sass - 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; }

mixin 返回一个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/

PSall和ease都是默认值，所以默认值可以简化为$values: 0.3s。