是否可以在 SASS 每个循环中动态使用变量名称？
这是一个简化的示例。我想做的是使用数组中的项目来输出我之前创建的变量值。下面尝试通过连接“$”创建变量的语法显然是错误的，但我用它来明确我想要做什么。
$puma-width: 100px;
$slug-width: 200px;
@each $animal in puma, slug {
.#{$animal}-title {
width: $+#{$animal}-width;
}
}
期望的输出：
.puma-title {
width: 100px;
}
.slug-title {
width: 200px;
}
This is a simplified example. What I'd like to do is use the items in the array to output variable values I've previously created. The syntax below that tries create a variable by concatenating a '$' is obviously wrong but I'm using it to make it clear what I'm trying to do.
$puma-width: 100px;
$slug-width: 200px;
@each $animal in puma, slug {
.#{$animal}-title {
width: $+#{$animal}-width;
}
}
Desired output:
.puma-title {
width: 100px;
}
.slug-title {
width: 200px;
}
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
这也是我在 SASS 中想要的东西，但在阅读了他们的讨论列表后，我得出的结论是，这种变量插值尚不受支持。
我没有尝试Less，但他们的文档表明使用@@语法是可能的。
That's something that I wanted in SASS as well, but after reading their discussion list, I concluded that this kind of variable interpolation is not supported yet.
I didn't try Less, but their documentation suggests it would be possible with @@ syntax.
另一种方法是为 @each 指令传递一个映射而不是项目列表。以下将起作用：
The alternative is to pass a map instead of item list for the @each directive. The following will work: