动态修改CSS样式
使用 uniapp 写微信小程序端项目，css 使用 var 注入变量，达到设置动态样式的需求
- 声明 css 变量时，变量名前面要加两根连词线（--）；
- 变量使用 kebab-case 命名方式，即 --header-color 而不是 --headerColor；
- 变量名大小写敏感，--header-color 和 --Header-Color 是两个不同的变量名；
- var() 函数用于读取变量。
实例
<template>
<view class="header" :style="[headerStyle]">头部内容</view>
</template>
<script>
export default {
name: 'test',
data() {
return { headerStyle: { '--header-color': 'pink' } };
}
};
</script>
<style lang="scss" scoped>
.header {
width: 100px;
text-align: center;
line-height: 100rpx;
border: 1px solid #aaa;
color: var(--header-color);
}
</style>原创2022/8/18小于 1 分钟