mirrors2/naive-ui-admin
1
0
Fork 0
mirror of https://github.com/jekip/naive-ui-admin.git synced 2026-02-08 23:42:27 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #134 from xiangshu233/main

Browse Source 
修复 useECharts Hooks 报错和暗色模式 bug
This commit is contained in:
Ah jung
2022-06-08 20:00:11 +08:00
committed by GitHub
parent 403a844668 a7257568cf
commit 88ada7ebee
1 changed files with 14 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
src/hooks/web/useECharts.ts
View File

@@ -10,23 +10,27 @@ import { useBreakpoint } from '@/hooks/event/useBreakpoint';
import echarts from '@/utils/lib/echarts';
// import { useRootSetting } from '@/hooks/setting/useRootSetting';
import { useDesignSetting } from '@/hooks/setting/useDesignSetting';
export function useECharts(
elRef: Ref<HTMLDivElement>,
theme: 'light' | 'dark' | 'default' = 'light'
theme: 'light' | 'dark' | 'default' = 'default'
) {
// const { getDarkMode } = useRootSetting();
const getDarkMode = 'light';
const { getDarkTheme: getSysDarkTheme } = useDesignSetting();
const getDarkTheme = computed(() => {
const sysTheme: string = getSysDarkTheme.value ? 'dark' : 'light';
return theme === 'default' ? sysTheme : theme;
});
let chartInstance: echarts.ECharts | null = null;
let resizeFn: Fn = resize;
const cacheOptions = ref<EChartsOption>({});
const cacheOptions = ref({});
let removeResizeFn: Fn = () => {};
resizeFn = useDebounceFn(resize, 200);
const getOptions = computed((): EChartsOption => {
if (getDarkMode !== 'dark') {
if (getDarkTheme.value !== 'dark') {
return cacheOptions.value;
}
return {
@@ -67,7 +71,7 @@ export function useECharts(
nextTick(() => {
useTimeoutFn(() => {
if (!chartInstance) {
initCharts(getDarkMode.value as 'default');
initCharts(getDarkTheme.value as 'default');
if (!chartInstance) return;
}
@@ -83,7 +87,7 @@ export function useECharts(
}
watch(
() => getDarkMode.value,
() => getDarkTheme.value,
(theme) => {
if (chartInstance) {
chartInstance.dispose();
@@ -102,7 +106,7 @@ export function useECharts(
function getInstance(): echarts.ECharts | null {
if (!chartInstance) {
initCharts(getDarkMode.value as 'default');
initCharts(getDarkTheme.value as 'default');
}
return chartInstance;
}