想要实现的功能：页面渲染前，从后端获取用户的数据，用户数据内含有style值，根据不同的style值动态改变商城的颜色风格。
原本我是只考虑了两个风格，然后在每个页面里做判断，后来考虑到后期可能会添加其他风格，而且这样写代码很乱还不容易维护，所以了解了一下样式的全局变量。
找了大半天less，sass的教程，功能很强大也很复杂，不知道该怎么入手，后来发现直接用css自带的变量功能就可以实现，而且很简单。
具体使用方法参考这个：https://codepen.io/dongCode/pen/jOrBmbG
一、在App.vue内定义好全局变量
:root{
--style:#579535;
}这样，项目内的所有vue文件都可以用这个变量了
二、在需要更换颜色的地方直接引用变量
就可以实现啦，想换什么颜色就换什么颜色
三、根据用户数据更改主题颜色
根据用户返回的style值，做判断就好了，然后用下面的代码实现颜色变换的功能
document.documentElement.style.setProperty('--style','color') //--style即为css变量，color为要更改的主题颜色四、获取变量值
比如我需要对--style变量的颜色做淡化处理，可以用下面代码获取该变量，再进行相应操作
getComputedStyle(document.documentElement).getPropertyValue('--style')
