Less

Question

我有一个 LESS 变量： @columns: 12;

我用它创建了一个动态 class 名称： .one-@{columns} {} // returns .one-12 {}

如何用字符串替换 12 "twelfth"

伪代码

.one-@{replace(columns, "twelfth")} {}

结果会是.one-twelfth {}

不胜感激！

Answer 1

解决这个问题的方法是使用数组：

而不是@columns: 12

我愿意@columns: 12, twelfth。

然后我提取值：

@columns-number: extract(@columns, 1);
@columns-class: extract(@columns, 2);

我可以使用 mixin 的目标值和 class 名称：

.@{columns-class} {
   .column(@columns-number);
}

Answer 2

假设（如评论中所示）您无法更改 @columns 变量本身的值，并且它的可能值不是无限的，一个简单的整数到字符串（或其他任何东西）的转换 table（一个简单的列表）就可以了：

@columns: 12;
@columns-string: extract(@i2s, @columns);

// usage:
.class-@{columns-string} {
    /* ... */
}

// the table:
@i2s:
    one
    two
    three
    four
    five
    six
    seven
    eight
    nine
    ten
    eleven
    twelve
    thirteen
    fourteen
    fifteen
    sixteen
    seventeen
    eighteen
    nineteen
    twenty
    ;

Less - 如何用字符串替换整数？

Less - How to replace integer with a string?

伪代码

解决这个问题的方法是使用数组：

然后我提取值：