獲取當前指數以較少的遞歸

Question

我試圖使這個：

我有一個這樣的數組：

@levels:'level_one','level_two','level_three','level_four','level_five','level_six','level_seven','level_eight'; 

每個那些水平也有相應的變量，是一種顏色，並與級別指示器的列表標記中的一個類相匹配。 我可以通過這些足夠簡單的循環來生成每個關卡的背景顏色。

我希望能夠爲每個項目自動設置高度，所以理論上如果我想爲指標添加第9或第10級別，我只需添加顏色變量，將其添加到數組中，然後添加相關的標記，而不必明確地設置每個類的高度。

.for(@levels); .-each(@color) { 
    @name: e(@color); 
    &.@{name} { 
     background:@@name; 
    } 
} 

我通過循環類似於上述的水平，但它在某種程度上可能得到循環的當前指數還有@levels陣列的數量制定一個基於百分比高度爲每項目？例如。如果有10個項目，第一個項目的高度等等是10％？

期待任何建議！

謝謝！

Answer 1

假設你正在使用for.less片段：有一個在.-each範圍額外@i變量可用（該變量被隱式地從.-each的來電者繼承）。

所以，你可以寫爲（除去不必要的引號）：

@levels: 
    level_one, 
    level_two, 
    level_three, 
    level_four, 
    level_five, 
    level_six, 
    level_seven, 
    level_eight; 

.for(@levels); .-each(@name) { 
    &.@{name} { 
     background: @@name; 
     height: (100% * @i/length(@levels)); 
    } 
} 

- - -

在現代少，你會使用Lists插件.for-each聲明已明確，其中達到同樣的指定的索引變量：

@levels: 
    level_one, 
    level_two, 
    level_three, 
    level_four, 
    level_five, 
    level_six, 
    level_seven, 
    level_eight; 

.for-each(@name, @i in @levels) { 
    &.@{name} { 
     background: @@name; 
     height: @i * 100%/length(@levels); 
    } 
}