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

您的解决方案不起作用。当没有参数使用时，e。克。

.foo { @include transition; }

transition mixin返回错误：

() 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为defaults，因此默认值可以简化为$values: 0.3s。

SASS - 变量参数的默认值

1 个答案: