CSS 自定义样式属性值（可用于主题切换）

CSS部分

#mainBox{
   --mainColor: #2EB3C5;   //自定义变量 有其作用域 --来定义变量名

//var函数 可以传两个值，第一个为 所要使用的变量名，第二个为当使用的变量失效时的备用值。
//第二个值可以不传
//在自定义属性值中，对字母大小写敏感
  .xxx{ 
      color: var(--mainColor,red)
     }
}

JS部分

//在方法中改变或设置样式变量 mainBox 为自己定义的ref
this.$refs.mainBox.style.setProperty('--mainColor', 'red')