Sass检查是否将变量传递给mixin

变量 CSS

Itachi理查德

2020-03-19

可以说我有一个默认值的mixin

$default: 1;

@mixin test($p : $default) {
    @if () {
        // Do something if $p was 4passed?
    } @else {
        // Do something if $p was not passed?
    }

}

如果我这样称呼mixin，则有两个不同的地方：

@include test(); // A
@include test(1);  // B

有什么办法可以区分默认值（A）和覆盖默认值（B）的区别吗？

第2386篇《Sass检查是否将变量传递给mixin》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

共1个回答

Itachi小卤蛋凯 2020.03.19

如果稍微修改一下，mixin就会起作用（因为您实际上需要将有问题的参数传递给@if指令。并且您希望将参数默认为nullor false，这意味着什么都没有传递）。

@mixin test($p: null) {
    @if ($p) {
        /* Do something if $p was passed */
    } @else {
        /* Do something if $p was not passed */
    }
}

演示

如果您想将其他值设置为默认值，则只需在if语句中检查该特定值（例如，“将if $p设置为默认值”）。在这里，您将如何通过设置变量的默认值来执行此操作，就像在示例中一样。但是，这不会区分“ 没有传递参数 ”和“ 传递的值等于默认值 ”。

@mixin test($p: $default) {
    @if ($p == $default) {
      /* Do something if $p is set to $default */
    } @else {
      /* Do something else if $p is not $default */
    }
}

演示

但实际上，您可以结合使用这两种方法...检查是否传递了某些东西$p（如果传递了或不传递，则执行其他操作），如果没有传递任何东西，请将set $p的值设置为default。

@mixin test($p: null) {
    @if ($p) {
      /* Do something if argument passed */
    } @else {
      /* Do something else if no argument passed. Set $p to default. */
      $p: $default;
    }
}

演示

现在，它应该适用于除，的布尔值以外的所有值false，null并且false都可以false使用@if指令进行验证。因此，要允许将其false作为参数值传递，您将需要使用更具体的表达式。例如：