问题描述
在SCSS中,我有一个mixin,它接受一个列表并检查其长度,如下所示:
In SCSS, I have a mixin that takes a list and checks its length, as follows:
@mixin foo($list){ @debug length($list); }
当我通过两个以上列表的列表 ($ a,$ a),如下所示:
$a: (1, 2, 3); @include foo(($a, $a));
length 函数计算有两个($ a,$ a)中的 $ a -s,并返回结果:
the length function counts that there are two $a-s inside of ($a, $a), and returns the result:
DEBUG: 2
但是当我通过由单个列表($ a)组成的列表时,如下所示:
but when I pass a list that consists of a single list ($a) as follows,
@include foo(($a));
看起来 $ a 分解, length 函数计算 $ a 中的三个元素,而不是计算 $ a ($ a),并返回结果:
it seems that the list $a is decomposed, and the length function counts the three elements in $a instead of counting the number of $a-s in ($a), and returns the result:
DEBUG: 3
列表进一步。以下所有操作都返回相同的结果:
It does not make difference if I embed the list further. All of the following return the same result:
@include foo($a); @include foo(($a)); @include foo((($a)));
这是预期的功能吗?为什么会发生这种情况,在这些情况下是否有返回 1 的方法?
Is this an expected feature? Why does this happen, and is there a way to return 1 in these cases?
推荐答案
在Sass中,括号用于表示操作的顺序,而不是表示您有一个单一元素的列表。
In Sass, parentheses are used to indicate order of operations, not to indicate that you have a list with a single element.
一个结尾的逗号将自动将您的值转换为一个列表:
In Sass 3.3, adding a trailing comma will automatically turn your value into a list:
$foo: 1, ;
你可能希望做的是让你的mixin接受可变数量的参数,作为列表。这看起来像这样:
What you may be wanting to do instead is have your mixin take a variable number of arguments and use them as a list. That would look like this:
@mixin foo($list...){ @debug length($list); } .foo { @include foo(1); } .foo { @include foo(1, 2); } .foo { @include foo((1, 2)); }
控制台提供所需的结果:
The console gives the desired results:
DEBUG: 1 DEBUG: 2 DEBUG: 1
但是,如果这样做,列表必须是mixin(或函数)的最后一个参数。
If you do this, however, the list must be the last argument of the mixin (or function).
这篇关于列表的单例列表自动分解的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!