如何在app.vue页面 scss中，使用data中的变量？
下图中不能对
page进行样式设置如：page { background: #F8F8F8; }
这里我需要对page进行变量分析之后，动态设置一个颜色
叶雨
- 发布：2023-09-29 07:27
- 更新：2024-03-18 00:28
- 阅读：425
喜欢技术的前端 - QQ---445849201
如果是v3 可以使用v-bind 修改样式
<template>
<view class="content bg">
dsd
<button @click="change">change</button>
</view>
</template>
<script>
export default {
data() {
return {
color:'red'
};
},
onReady() {
},
methods:{
change(){
this.color = 'blue'
}
}
};
</script>
<style scoped lang="scss">
.bg{
background-color: v-bind(color);
}
</style>
叶雨 (作者)
谢谢啊
2023-10-10 09:56
喜欢技术的前端
回复 叶雨: 不客气，(●'◡'●)
2023-10-10 10:03
叶雨 (作者)
回复 喜欢技术的前端: 确实可以用
我当前的期望：通过设置一个全局class动态样式，然后统一控制
比如：根据用户性别，统一设置背景。就是想在app.vue文件一次性引入。
目前来看，这种变量似乎不会穿透，就算是在普通页设置（不添加scope）也是不会向下一级传递样式，和静态的class样式不一样
2023-10-10 10:38
喜欢技术的前端
回复 叶雨: 可以试试这个 https://www.cnblogs.com/lovejielive/p/16981875.html
2023-10-10 14:41