在Sass中将变量设置为@mixin?

有没有办法设置@include mixin();变量?我试过了

@mixin bg-gradient($fallback, $type, $positionX, $positionY, $from, $from-percent, $to, $to-percent){
    background: $fallback;
    background: -webkit-#{$type}-gradient($positionX $positionY, $from $from-percent, $to $to-percent);
    background:    -moz-#{$type}-gradient($positionX $positionY, $from $from-percent, $to $to-percent);
    background:         #{$type}-gradient($positionX $positionY, $from $from-percent, $to $to-percent);
}

$navBg: @include bg-gradient(#eee, radial, top, center, #999, 0%, #555, 100%);
body { $navBg; } // it gave me an error
神无2020/03/24 14:17:14

如果尝试将返回值设置为SASS变量,则需要使用@function,而不是@mixin。这让我挂了一会儿,却没有意识到@function。例如...

@function font($font-size, $line-height: 1.4, $font-family: Arial) {

    @if $line-height == 1.4 {
        $line-height: round($line-height*$font-size);
    }

    @return #{$font-size}/#{$line-height} $font-family;
}

$font-medium: font(20px);

顺便说一句,尽管这不能完全满足该用户的需求,但这是互联网搜索中弹出的唯一一则关于将var设置为mixin的信息,所以我想在这里与其他人分享以了解如何做如果出现这种情况。

西门2020/03/24 14:17:14

我不知道有什么具体的方法可以实现,但是如果您只是尝试在特定类型的渐变上干燥设置,则可以为其编写包装mixin:

@mixin navBg() {
    @include bg-gradient(#eee, radial, top, center, #999, 0%, #555, 100%);
}
body { @include navBg; }

编辑

是SASS变量支持的数据类型的列表。既不包括mixin调用,也不包括它们的结果(整个CSS规则)。我还尝试将include作为字符串处理并内插,但这仅适用于最终结果CSS,不适用于其他指令。