css中只使用vue的变量

参考:https://blog.csdn.net/FellAsleep/article/details/130617163

1、必须作用在用一个div上

2、变量必须有双横杠"--"

javascript 复制代码
<span
 class="bb" 
 :style="spanStyle">11</span>
javascript 复制代码
data() {
	return {
		spanStyle: {
          "--color": '#bfa' //默认值
        },
	}
}
javascript 复制代码
created(){
  setTimeout(()=> {
    this.spanStyle["--color"] = 'red'
  },5000)
},
javascript 复制代码
.bb {
  color: var(--color);
}
相关推荐
captain376几秒前
Spring Web MVC(2)
java·前端·spring boot·后端·spring·mvc
ai工具集合13 分钟前
老项目位图图标放大模糊?PNG 一键转 SVG 矢量化实操,附前端避坑指南
前端
2601_9687080315 分钟前
DreamsChat Web – Chat, Audio, Video Web APP with Admin Dashboard
前端·架构
小大宇20 分钟前
Vue知识点8-Watch
前端·javascript·vue.js
垆边人似月.21 分钟前
选型与快速跑通(Tesseract / EasyOCR / PaddleOCR)
前端·python
IT_陈寒22 分钟前
一文搞懂Java的核心概念
前端·人工智能·后端
铁皮饭盒26 分钟前
workbuddy和codebuddy免费送1000积分, 10秒钟搞定
前端·后端
风骏时光牛马35 分钟前
从零到落地的AI系统学习进阶路线
前端
橙光成长3 小时前
PDF离线工具箱深度解析:4MB纯前端单文件,40+功能全本地运行,文件绝不上传
前端·pdf·1024程序员节
小poop9 小时前
CSS 基础与实战:从入门到精通网页美化
前端