我在SCSS使用Vue3 v-bind,為的是給我的應用程序注入動態主題。當我想在第三方橫幅(Cookie同意)上應用這個主題時,這個問題開始了,它在應用程序加載后加載。但是我看到Vue沒有將這個主題變量構建為CSS hash,但是我得到了以下內容:
// Browser CSS Inspect
#banner {
background-color: var(--7a7a37b1-theme\[\'brand-1\'\]); //when I over on it says "is not defined"
}
// App.vue
<template>
// some app code in here
</template>
<script>
// 3rd party script for loading the banner
</script>
<style lang="scss">
// the banner with this CSS id, will be created as soon as the script loaded.
#banner {
background-color: v-bind("theme['brand-1']");
}
</style>
總之,我不確定如何使用Vue和Vite在橫幅上應用這個動態主題。