更少的变量：这可能吗

所以我的代码在类型方面存在重大问题，但我似乎无法解决它。

每当我减去1从线8有问题。
我该如何解决这个问题？

@max-columns: 2;
@column-1-width-min: 30;
@column-2-width-min: 40;

.loop-column(@index) when (@index > 0) {

  @max-minus-1a: "@{column-@{index}-width-min}";
  @max-minus-1b: @max-minus-1a - 1; // problem child

  @min: ~"min-width: @{column-@{index}-width-min}";
  @max: ~"max-width: @{max-minus-1b}";

  @media (@min) and (@max) {

    [data-deckgrid="card"]::before {
      content: "@{index} .column.card-column-@{index}";
    }
  }

  .loop-column(@index - 1);
}

.loop-column(@max-columns);

除了您可以找到的方法之外这个答案 https://stackoverflow.com/a/21935278/2712740（正如我在上面的评论中已经提到的），我认为整个代码片段可以简化为类似的内容（低于 1.5.x 或更高版本）：

@column-widths: 30, 40, 55, 500; // etc.

.loop-column(@index) when (@index > 0) {
    .loop-column(@index - 1);

    @min:  extract(@column-widths, @index);
    @max: (extract(@column-widths, @index + 1) - 1);

    @media (min-width: @min) and (max-width: @max) {
        [data-deckgrid="card"]::before {
            content: "@{index} .column.card-column-@{index}";
        }
    }
}

.loop-column(length(@column-widths) - 1);

CSS 结果如下：

@media (min-width: 30) and (max-width: 39) {
  [data-deckgrid="card"]::before {
    content: "1 .column.card-column-1";
  }
}
@media (min-width: 40) and (max-width: 54) {
  [data-deckgrid="card"]::before {
    content: "2 .column.card-column-2";
  }
}
@media (min-width: 55) and (max-width: 499) {
  [data-deckgrid="card"]::before {
    content: "3 .column.card-column-3";
  }
}

IE。您不需要通过“索引变量名称”来模拟数组，因为您可以直接使用数组（Less array 只是逗号或空格分隔的值列表，例如@padding: 1 2 3 4;).