在主题组件中使用变量结合@if的任何方法吗？

开发
1

我正在尝试使用布尔主题设置来确定我是否可以使用特定的样式设置：

@if var(--my-variable) {
   .my-selector {
      display: block;
  }
}

并在包含的文件中的其他位置：

:root {
  --my-variable: #{$my_boolean_setting_in_theme};
}

但这似乎不起作用……

无论变量是 true 还是 false，样式都会被应用。

3 个赞
2

运行时 CSS 变量（如 --my-variable）无法在 SASS/SCSS 构建时 @if 语句中使用。

因此，我认为您必须完全在构建时处理此问题，仅限于使用 SCSS 变量。类似这样：

@if $my_boolean_setting_in_theme == "true" {
  ...
}
5 个赞
3

谢谢你，大卫，我尝试了各种类似的组合，不知道为什么我没有想到那个，谢谢！

3 个赞
4

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.