是否可以通过数据绑定(bind)更改 sass 变量?
示例:我想用按钮更改变量的颜色。
除了 Knockout.js 之外,我还愿意接受其他解决方案。
$color: red;
my_class {
background-color: $color;
height:20px
width:20px;
}
<button type="button" data-bind="css: { $color: 'green'}">Change to Green</button>
<div class="my_class"></div
最佳答案
SASS 是一个 CSS 预处理器,在 SASS 文件编译期间,将变量 ($color
) 的每次出现替换为其精确值 (red
)。
因此,在 SASS 编译成 CSS 后,您就无法影响它。
您可以使用样式绑定(bind)
<div data-bind="style: { color: currentProfit() < 0 ? 'red' : 'black' }">
Profit Information
</div>
如 documentation 中所述为了改变特定元素的颜色。
或者您可以从 View 模型返回此颜色并在样式绑定(bind)中使用它。
关于javascript - 使用 Knockout 绑定(bind)或其他解决方案影响 Sass 变量,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45940785/