Stylus Mixin如何对变量定义的两侧进行插值,例如:
--MyVariable: MyVariable在编译后的CSS中,--MyVariable应该保留为变量名,而第二个变量应该是为在其他地方定义的这个Stylus变量计算的数值。
我将有许多这样的CSS变量和Stylus变量对。现在,尽管我可以手动将它们写在Stylus文件中,但我希望有一个Mixin,它允许我通过将名称的共享部分作为Mixin的单个参数编写一次来创建它们,例如:
VariablePair(MyVariable-1) // --MyVariable-1: MyVariable-1
VariablePair(MyVariable-2) // --MyVariable-2: MyVariable-2
VariablePair(MyVariable-3) // --MyVariable-3: MyVariable-3我试过了:
VariablePair(VariableName)
--{VariableName}: VariableName
VariablePair(MyVariable)它不能解析。
我意识到没有''的MyVariable将作为一个不能附加到--的实际值出现。但是,将''作为VariablePair('MyVariable')添加到它将导致定义本身的右侧变成一个字符串,而不是用于计算的Stylus变量。
我尝试了括号的存在/缺失、''和$以及连接的不同组合,但它们似乎都不起作用。'--' + VariableName + ': ' + VariableName (带/不带括号/ CSS )不工作,它要么不解析,要么解析,但没有在编译后的$中创建一行。
对此有解决方案吗?
发布于 2021-11-05 21:32:29
unquote works for this
VariablePair(name, val)
{unquote('--' + name)}: val
.selector
VariablePair('fontcolor', red)
color: var(--fontcolor)将输出
.selector {
--fontcolor: #f00;
color: var(--fontcolor);
}https://stackoverflow.com/questions/69479645
复制相似问题