更少的 mixin 范围问题

Question

我构建了一个参数 mixin，它根据我创建的“节点值”系统查找元素的子元素。发生的事情是通过循环函数“.extractArrays”找到孩子，其中包含“.deliverChild”。然后将孩子（最多 4 个）放入“.calculateWidth”中，它在变量中返回孩子的宽度（例如“calculatedWidth1”）。

问题是：当没有第三个和第四个孩子时，@child3 和@child4 未设置，这会产生错误。我在 mixins 之前将 @child3 和 @child4 设置为零，希望这会在调用 mixins 之前给它们默认值 0。然而，由于某种原因，当有第三个孩子时，mixin 的 @child3 返回值不会覆盖设置为 0 的 @child3。我不确定为什么会发生这种情况，但我觉得有几件事当涉及到 mixins 和范围时，这让我对 Less 感到厌烦。

@child3: none, 0 0, 0, 0;
@child4: none, 0 0, 0, 0;

    .extractArrays(@index, @node, @node-value, @elements-array) when (@index <= @length-elements-array) {
        @element-array: extract(@elements-array, @index);
        @found-node: extract(@element-array, 2);
        .deliverChild(@element-array, @found-node) when (@found-node = @child-node-value1) {
            @child1: extract(@element-array, 1);
        }
        .deliverChild(@element-array, @found-node) when (@found-node = @child-node-value2) {
            @child2: extract(@element-array, 1);
        }
        .deliverChild(@element-array, @found-node) when (@found-node = @child-node-value3) {
            @child3: extract(@element-array, 1);
        }
        .deliverChild(@element-array, @found-node) when (@found-node = @child-node-value4) {
            @child4: extract(@element-array, 1);
        }
        .deliverChild(@element-array, @found-node);
        .extractArrays(@index + 1, @node, @node-value, @elements-array);
    }
    .extractArrays(1, @node, @node-value, @elements-array);


    .calculateWidth(@child1, 1);
    .calculateWidth(@child2, 2);
    .calculateWidth(@child3, 3);

    width: @calculatedWidth1 + @calculatedWidth2 + @calculatedWidth3 + @calculatedWidth4;

Answer 1

（不是对上述“范围”问题的确切答案，而是在上述 cmets 建议的替代方法中用作起点的算法）：

通用数组过滤 mixin 看起来像这样（小于 1.7.5 或更高版本）：

@array: // key value
    a 1,
    b 2,
    c 3,
    a 4,
    d 5,
    a 6,
    c 7;

// usage:
usage {
   .filter-array(@array, a); 
    result: @filter-array;
}

// impl.:
.filter-array(@array, @key, @key-index: 1) {
    .-(length(@array));
    .-(@i, @r...) when (@i > 0)
        and not(@key = extract(extract(@array, @i), @key-index)) {
            // skip item since key does not match
            .-((@i - 1), @r);
    }
    .-(@i, @r...) when (length(@r) > 0)
        and (@key = extract(extract(@array, @i), @key-index)) {
            // key matches and @r is not empty so concat current item to @r
            .-((@i - 1); extract(@array, @i), @r);
    }
    .-(@i, @r...) when (length(@r) = 0)
        and (@key = extract(extract(@array, @i), @key-index)) {
            // key matches and @r is empty so this is our first item
            .-((@i - 1), extract(@array, @i));
    }
    .-(@i, @r...) when (@i = 0) {
        // define "return" variable:
        @filter-array: @r;
    }
}

结果数组等于：

@filter-array:
    a 1,
    a 4,
    a 6;

这看起来相当可怕和冗长，但仍然比原来的方法更干净、更可控。

此外，提供一个专用的 mixin 来返回数组项的某些值的总和（或任何其他“转换”，结果为单个值）是有意义的（这样可以将实现简化到某个点因为您不需要连接任何东西，并且上述某些条件和/或 mixin 特化变得不必要）。