# 自定义主题
Vue-iClient 内置了 13 套主题，CSS 命名采用 BEM 的风格，方便使用者覆盖样式。
你可以通过以下方式定义主题。
# 使用 Vue-iClient 内置主题
import Vue from 'vue';
import VueiClient from '@supermap/vue-iclient';
import App from './App.vue';
// 可以通过两种方式使用内置主题
// 1 初始化组件时传入主题配置
Vue.use(VueiClient, { theme: 'light' });
// 2 通过 setTheme 方法设置主题
VueiClient.setTheme({ theme: 'light' });
# 使用自定义主题
你需要定义一个 theme 对象，包含 textColor background colorGroup 三个属性。
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|---|---|---|---|---|
| textColor | 字体颜色 | string | - | - |
| background | 背景颜色 | string | - | - |
| colorGroup | 颜色数组 | string[ ] | - | - |
如下例所示：
let theme = {
textColor: '#eee',
background: 'rgba(0,0,0,0)',
colorGroup: ['#3fb1e3', '#6be6c1', '#626c91', '#a0a7e6', '#c4ebad']
};
Vue.use(VueiClient, { theme });
// 或
VueiClient.setTheme({ theme });