较少mixin - 没有引号的输出值

2 css css3 less

我正在尝试用CSS转换的多个输入参数值编写一个LESS mixin.输入值是要完成的转换类型以及与转换关联的值.

例如,考虑下面给出的代码:

.transform(@type; @value){
}
Run Code Online (Sandbox Code Playgroud)

如果我输入type='rotateY'value='360deg',输出应该是transform: rotateY(360deg).我已经尝试了以下选项,但它们似乎都没有工作(输出被提及为注释).

transform: "@{type}(@{value})"; /* Output: "rotateY(360deg)" */
transform: @{type}(@{value}); /* Output: Compiler error */
transform: @type(@value); /* Output: rotateY 360deg */
Run Code Online (Sandbox Code Playgroud)

我该如何编码以获得所需的输出?请帮忙.

注意:mixin代码还有很多其他项目,我只发布了需要修复的行.

Har*_*rry 12

只需使用~如下所示的字符串转义即可.这样做可以确保引号不会在输出CSS中打印出来.

输入代码:

transform: ~"@{type}(@{value})";
Run Code Online (Sandbox Code Playgroud)

要么

transform: e("@{type}(@{value})");
Run Code Online (Sandbox Code Playgroud)

Mixin致电:

.transform(rotateY;360deg);
Run Code Online (Sandbox Code Playgroud)

输出CSS:

transform: rotateY(360deg);
Run Code Online (Sandbox Code Playgroud)