Question

考虑以下两个混音：

@mixin padding($v: 8px)
  padding: $v - 3 $v $v - 3 $v

@mixin button($padding: "")
  @include padding($padding)
  @include border-radius
  border: 1px solid black

我可以在没有参数的情况下调用@include padding，并且使用默认的8px，没问题。但是如何调用button mixin并且仍然在padding mixin中使用默认值？如果我只是在没有参数的情况下调用@include button，那么button mixin似乎仍会将某种参数传递给padding（padding不可避免地将其解释为0，因此不会添加任何参数填充）。根据{{3}}，我尝试将button mixin修改为

@include padding(unquote($padding))

但是没有效果 - padding似乎仍然将参数解释为0，而不是没有参数，因此使用其默认值。

Answer 1

通常通过将两个mixins的默认参数设置为相同的值来解决此问题。您可能希望为此目的使用全局变量：

$default-padding: 8px

@mixin padding($v: $default-padding)
  padding: $v - 3 $v $v - 3 $v

@mixin button($padding: $default-padding)
  @include padding($padding)
  @include border-radius
  border: 1px solid black

将“空”参数传递给SASS mixin，以便使用默认参数

1 个答案: