css - 如何将scss变量设置为css变量使用javascript

Question

我想在 vue 的一个方法中将 scss 变量设置为 css 变量。

$color: #000;
--varColor: #{$color}

我想通过道具动态设置，但它不起作用。有谁知道如何做到这一点？谢谢

'--backgroundColor': `#{${props.backgroundColor}}`,

标签： cssdynamicsassvuejs3vue-composition-api

Answer 1

我不认为你能做到这一点。SCSS是一个CSS预处理器，这里强调pre。因此，当您的代码执行时，SCSS将不再存在，而是编译为CSS。

但是您可以使用JavaScript方法来操作CSS ，例如. style.setProperty