uniapp更改主题颜色

1、需求：用户在管理系统配置app端的颜色，用后端返回主题颜色来更改全局的主题颜色

2、在stores里面请求后端返回的数据

比如：

 themeStyle: {

            // 后端返回

            '--primary-color': '#24C858', // 默认主题颜色

            '--primary-second-color': '#BEEACB' // 默认次主题颜色

        }

3、在hooks文件新建themeStyle.ts，

内容如下：

import { useAppStore } from '@/stores/app'

const appStore = useAppStore()

export const skinStyle = appStore.getThemeStyle

4、在页面使用

导入：

import { skinStyle } from '@/hooks/themeStyle'

在index.vue里面，在元素上设置:style="skinStyle"

<template>

  <view class="container" :style="skinStyle">

  </view>

</template>

缺点：每个需要的页面都需要导入并且使用

npm i unplugin-auto-import --save-dev  自动导入的在uniapp项目，安装要报错，只能自己手动导入了