javascript/vueecharts
1
0
Fork 0
mirror of https://github.com/ecomfe/vue-echarts.git synced 2025-10-31 00:46:04 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: support injection for theme

Browse Source
This commit is contained in:
Justineo
2021-02-22 14:36:06 +08:00
parent cd02c3131c
commit 84a89e3883
4 changed files with 32 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
src/ECharts.ts
View File

@ -17,12 +17,13 @@ import {
import { init as initChart } from "echarts/core";
import {
EChartsType,
Option,
Theme,
ThemeInjection,
InitOptions,
InitOptionsInjection,
Option,
UpdateOptions,
UpdateOptionsInjection,
Theme
UpdateOptionsInjection
} from "./types";
import {
usePublicAPI,
@ -33,6 +34,7 @@ import {
} from "./composables";
import "./style.css";
export const THEME_KEY = "ecTheme";
export const INIT_OPTIONS_KEY = "ecInitOptions";
export const UPDATE_OPTIONS_KEY = "ecUpdateOptions";
export { LOADING_OPTIONS_KEY } from "./composables";
@ -52,28 +54,29 @@ export default defineComponent({
...loadingProps
},
setup(props, { attrs }) {
const defaultInitOptions = inject(
INIT_OPTIONS_KEY,
{}
) as InitOptionsInjection;
const defaultUpdateOptions = inject(
UPDATE_OPTIONS_KEY,
{}
) as UpdateOptionsInjection;
const root = ref<HTMLElement>();
const chart = shallowRef<EChartsType>();
const manualOption = shallowRef<Option>();
const defaultTheme = inject(THEME_KEY, null) as ThemeInjection;
const defaultInitOptions = inject(
INIT_OPTIONS_KEY,
null
) as InitOptionsInjection;
const defaultUpdateOptions = inject(
UPDATE_OPTIONS_KEY,
null
) as UpdateOptionsInjection;
const realOption = computed(
() => manualOption.value || props.option || Object.create(null)
);
const realInitOptions = computed(() => ({
...unref(defaultInitOptions),
...props.initOptions
}));
const realUpdateOptions = computed(() => ({
...unref(defaultUpdateOptions),
...props.updateOptions
}));
const realTheme = computed(() => props.theme || unref(defaultTheme) || {});
const realInitOptions = computed(
() => props.initOptions || unref(defaultInitOptions) || {}
);
const realUpdateOptions = computed(
() => props.updateOptions || unref(defaultUpdateOptions) || {}
);
const { autoresize, manualUpdate, loading, loadingOptions } = toRefs(props);
function init(option?: Option) {
@ -83,7 +86,7 @@ export default defineComponent({
const instance = (chart.value = initChart(
root.value,
props.theme,
realTheme.value,
realInitOptions.value
));