Question

H我，使用 Less ，这就是我所希望的：

.createClass() {

    @varone:one;
    @vartwo:two;
    @classname: @{varone}_@{vartwo};

    .testClass_@{classname} {
       padding:.5em;
    }

}
.createClass();

我尝试过的一些 searches ：

@classname: '@{varone}_@{vartwo}';

但这会呈现为：

    .testClass_'one_two' {
       padding:.5em;
    }

我读到了关于更温和~（但可能仅适用于我在搜索中找到的无效的）

@classname: ~'@{varone}_@{vartwo}';

没有跑。

我在节点上运行，通过 grunt less contrib

进行编译

如何以这种方式呈现'未加引号的字符串'/是否可能？

非常感谢，

Answer 1

@classname: ~'@{varone}_@{vartwo}';（或双引号相同）是正确的语法，适用于所有符合要求的Less编译器。即：

.createClass() {
    @varone: one;
    @vartwo: two;
    @classname: ~'@{varone}_@{vartwo}';

    .testClass_@{classname} {
        padding: .5em;
    }
}

.createClass();

Answer 2

啊，我找到了它。

http://lesscss.org/functions/#string-functions

可以使用：

@classname: e(@{varone}_@{vartwo});

e(str)过滤器执行此操作

我需要更多的RTFM！

变量连接 - 使用mixin动态创建类名

2 个答案: