fix: useEcharts return invalid instance (#5360)
Some checks are pending
CI / Test (ubuntu-latest) (push) Waiting to run
CI / Test (windows-latest) (push) Waiting to run
CI / Lint (ubuntu-latest) (push) Waiting to run
CI / Lint (windows-latest) (push) Waiting to run
CI / Check (ubuntu-latest) (push) Waiting to run
CI / Check (windows-latest) (push) Waiting to run
CI / CI OK (push) Blocked by required conditions
CodeQL / Analyze (${{ matrix.language }}) (none, javascript-typescript) (push) Waiting to run
Deploy Website on push / Deploy Push Playground Ftp (push) Waiting to run
Deploy Website on push / Deploy Push Docs Ftp (push) Waiting to run
Deploy Website on push / Deploy Push Antd Ftp (push) Waiting to run
Deploy Website on push / Deploy Push Element Ftp (push) Waiting to run
Deploy Website on push / Deploy Push Naive Ftp (push) Waiting to run
Release Drafter / update_release_draft (push) Waiting to run

This commit is contained in:
Netfan 2025-01-12 09:54:37 +08:00 committed by GitHub
parent 6719e2679f
commit b785bc5704
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -2,6 +2,8 @@ import type { EChartsOption } from 'echarts';
import type { Ref } from 'vue';
import type { Nullable } from '@vben/types';
import type EchartsUI from './echarts-ui.vue';
import { computed, nextTick, watch } from 'vue';
@ -50,7 +52,10 @@ function useEcharts(chartRef: Ref<EchartsUIType>) {
return chartInstance;
};
const renderEcharts = (options: EChartsOption, clear = true) => {
const renderEcharts = (
options: EChartsOption,
clear = true,
): Promise<Nullable<echarts.ECharts>> => {
cacheOptions = options;
const currentOptions = {
...options,
@ -58,9 +63,8 @@ function useEcharts(chartRef: Ref<EchartsUIType>) {
};
return new Promise((resolve) => {
if (chartRef.value?.offsetHeight === 0) {
useTimeoutFn(() => {
renderEcharts(currentOptions);
resolve(null);
useTimeoutFn(async () => {
resolve(await renderEcharts(currentOptions));
}, 30);
return;
}
@ -72,7 +76,7 @@ function useEcharts(chartRef: Ref<EchartsUIType>) {
}
clear && chartInstance?.clear();
chartInstance?.setOption(currentOptions);
resolve(null);
resolve(chartInstance);
}, 30);
});
});
@ -109,7 +113,7 @@ function useEcharts(chartRef: Ref<EchartsUIType>) {
return {
renderEcharts,
resize,
chartInstance,
getChartInstance: () => chartInstance,
};
}