Question

是否可以将通用字符串传递给mixin in less？我习惯于传递像：

这样的值

.border-radius (@radius) {
    -webkit-border-radius: @radius;
    -moz-border-radius: @radius;
    -ms-border-radius: @radius;
    -o-border-radius: @radius;  
    border-radius: @radius;
}

但是我现在发现我想做这样的事情：

.makeRed (@style) {
    @style: red;
}
.makeRed('border-color');

我已经尝试过以上但它不起作用，它不会抛出编译错误它只是没有编译任何东西。

想法？

Answer 1

是的，您可以将属性名称传递给mixin，并使用Less中的属性名称插值为其指定值。

mixin值应该像花括号（@{style}）中的字符串一样引用。另外，mixin调用应该在选择器块内进行，因为否则参数mixin在编译时不会产生任何输出。

.makeRed (@style) {
    @{style}: red; // using the parameter
}

#id{ // selector block
    .makeRed(border-color); // mixin call with no quotes
}

注意：此方法仅适用于Less v1.6.0及更高版本。

将样式属性传递给less mixin

1 个答案: