zuaa
/
vue-vben-admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: auto resize echart on menu collapsed, fixed #2265

This commit is contained in:
无木 2022-10-29 10:05:44 +08:00
parent 58b30aae9a
commit e962fa039a
1 changed files with 8 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -8,12 +8,14 @@ import { useEventListener } from '/@/hooks/event/useEventListener';
import { useBreakpoint } from '/@/hooks/event/useBreakpoint';
import echarts from '/@/utils/lib/echarts';
import { useRootSetting } from '/@/hooks/setting/useRootSetting';
import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
export function useECharts(
elRef: Ref<HTMLDivElement>,
theme: 'light' | 'dark' | 'default' = 'default',
) {
const { getDarkMode: getSysDarkMode } = useRootSetting();
const { getCollapsed } = useMenuSetting();
const getDarkMode = computed(() => {
return theme === 'default' ? getSysDarkMode.value : theme;
@ -98,6 +100,12 @@ export function useECharts(
},
);
watch(getCollapsed, (_) => {
useTimeoutFn(() => {
resizeFn();
}, 300);
});
tryOnUnmounted(() => {
if (!chartInstance) return;
removeResizeFn();