css - Less 列表作为 mixin 参数

Question

假设我有这个 mixin:

.loop-strings("A, B, C", "1, 2, 3", "X, Y, Z";);

这样实现:

.loop-strings(@list, @index: 1) when (isstring(extract(@list, @index))) {
    @currentMember: extract(@list, @index);

    .do-something-with(@currentMember);

    .loop-strings(@list, (@index + 1)); /* loop the next member */
}

.do-something-with(...) {
    @args1 : e(@arguments); 
    @args2 : A, B, C;
    args1: @args1;
    args2: @args2;
    extract-args1-2: extract(@args1, 2);
    extract-args2-2: extract(@args2, 2);
}

结果:

args1: A, B, C;
extract-args1-2: extract(A, B, C, 2);
args1: 1, 2, 3;
extract-args1-2: extract(1, 2, 3, 2);
args1: X, Y, Z;
args2: A, B, C;
extract-args1-2: extract(X, Y, Z, 2);
extract-args2-2: B;

这些接缝是 @foo:e("A, B, C"); 或 @foo:~"A, B, C"; 和 @foo:A, B, C;

我似乎不能使用 extract(@foo, 2); 除非它被定义为一个对象列表。

有没有办法将转义字符串转换为对象列表

Answer 1

It seams to be a difference between e("A, B, C") or ~"A, B, C" and A, B, C

是的，e("A, B, C") 和 ~"A, B, C" 都创建了所谓的“匿名值”类型，即从未被视为有意义的类型(它不是列表，不是数字，甚至不是字符串)。基本上，转义值就像“别碰我”或“我知道我在做什么!”东西，它们只是“按原样”输出，编译器从不试图理解里面的内容。这基本上就是escaped values到底是什么用于:“打印”出编译器无法理解的内容。

一般来说，您可以同时使用逗号和空格作为列表中的值分隔符。例如，您可以使用 .loop-strings(A B C, 1 2 3, X Y Z;);(二维列表作为单个参数，因此使用多参数混合您甚至可以获得一棵树维列表在一行中)。您是否有任何特殊原因需要使用引号和/或转义值？例如你可以这样写:

test {
    .loop-lists(A, B, C; 1, 2, 3; X, Y, Z);
}

.loop-lists(@lists...) {
    .loop(length(@lists));
    .loop(@i) when (@i > 0) {
        .loop((@i - 1));
        .do-something-with(extract(@lists, @i));
    }
}

.do-something-with(@list) {
    v1: extract(@list, 1);
    v2: extract(@list, 2);
    v3: extract(@list, 3);
}

---

extract(A, B, C, 2);

目前这是不正确的 extract 语法，extract 只接受两个参数，所以你可以这样写:

extract(A B C, 2);

或如:

@list: A, B, C;
extract(@list, 2);

---

这是一个带有几个附加通用提示的示例:

test {
    .do-something(A B C, 1 2 3, X Y Z; foo bar, baz; banana);
}

.do-something(@p1, @p2, @p3) {
    args1: @arguments;                                     // 3D list
    args2: extract(@arguments, 1);                         // 2D list: A B C, 1 2 3, X Y Z
    args3: extract(extract(@arguments, 1), 1);             // 1D list: A B C
    args4: extract(extract(extract(@arguments, 1), 1), 1); // single value: A

    p1- :   @p1;               // A B C, 1 2 3, X Y Z
    p1-1:   extract(@p1, 1);   // A B C
    p1-3:   extract(@p1, 3);   // X Y Z

   @p2-1:   extract(@p2, 1);   // foo bar
    p2-1:   @p2-1;             // foo bar
    p2-1-2: extract(@p2-1, 2); // bar
    p2-2:   extract(@p2, 2);   // baz

    p3- :   @p3;               // banana
    p3-1:   extract(@p3, 1);   // banana
    // etc.

    quoted-p2: "@{p2}"; // if you need a quoted string do it in reverse (i.e. non-quoted list to a quoted string)
}