如何在带有 sass 的转换语句中强制使用括号？

Question

我想在 sass 中动态构建一个转换语句（作为混合参数），但我不确定如何强制使用括号。

$dir: translateY;
$val: 42;
$i: 3;

.test {
  transform: #{$dir}(#{$val * $i}) scale(1);
}

应该变成

.test {
  transform: translateY(126) scale(1);
}

它在 libsass 下正是这样做的，但不幸的是我不能在这个项目中使用它。另一方面，我可以使用 @if 语句来完成，但感觉不一样。

Answer 1

你需要引用它，然后再次使用插值：

$dir: translateY;
$val: 42;
$i: 3;

.test {
  // either of these will work
  transform: #{'#{$dir}(#{$val * $i})'} scale(1);
  transform: #{$dir}#{'(#{$val * $i})'} scale(1);
}

如何在带有 sass 的转换语句中强制使用括号？

How can I enforce brackets in a transform statement with sass?

sass

css-transforms