如果我有一个不太像的列表:
@colors: 'red' #f00, 'green' #0f0, 'blue' #00f;
我知道我可以循环列表并获取颜色,但如果我想获取特定的颜色怎么办?说我想做
extract(@colors, 'green')
将 #0f0 从列表中删除。有没有办法做到这一点?如果需要几步而不是 1 步就可以了,我只是好奇这是否可能。该文档仅提到通过索引从列表中获取项目。
http://lesscss.org/functions/#list-functions-extract http://lesscss.org/functions/#list-functions-extract
The Lists https://github.com/seven-phases-max/less-plugin-lists#less-plugin-lists较少的插件有at https://github.com/seven-phases-max/less-plugin-lists/blob/master/docs/ref.md#at函数,所以你的代码可能很简单:
@colors: red #f00, green #0f0, blue #00f;
div {
color: at(@colors, green);
}
- - -
原始的“Legacy Less”答案:
没有专门的函数,但是为此编写一个 mixin 不是问题:
@colors:
'red' #f00,
'green' #0f0,
'blue' #00f;
usage {
.by-key(@colors, 'green');
property: @by-key;
}
// ............................
// impl.
.by-key(@array, @key, @fallback...) {
.-(length(@array));
.-(@i) when (@i > 0) {.-((@i - 1))}
.-(@i) when (@key = extract(extract(@array, @i), 1)) {
@by-key: extract(extract(@array, @i), 2);
}
.--() {@by-key: @fallback} .--;
}
里面发生了什么.by-key
mixin?
-
.-
是一个 mixinloop http://lesscss.org/features/#loops-feature trough @array
找到感兴趣的配对。
-
.-(length(@array));
启动第一次迭代(从最后一次迭代开始)@array
index)
-
.-(@i) when (@i > 0) ...
是迭代混合定义,它简单地调用下一个迭代(直到第一个迭代)@array
index) - 因此这两个形成了我们的递归循环。
-
.-(@i) when (@key = ...
是另一个迭代定义,它将当前项键与感兴趣的键进行比较,如果它们匹配,则定义@by-key
我们将使用的变量回报 http://lesscss.org/features/#mixins-as-functions-feature value.
- 最后
.--() {@by-key: @fallback} .--;
是另一个 mixin 的定义和立即调用,它也定义了@by-key
如果在之前的循环中没有找到具有指定键的值,则该变量将生效。 (因此,如果您将上面代码片段中的 mixin 称为.by-key(@colors, 'banana', #123);
它会返回#123
。这个“后备”部分可以被省略,然后如果在数组中找不到键(类似于“变量”),代码将导致错误@by-key
没有定义”)。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)