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

refactor!: remove resize-detector and update vue deps to 2.7+

Browse Source
This commit is contained in:
Justineo
2024-05-11 15:36:34 +08:00
committed by GU Yiling
parent d774558f3e
commit 3c7ff95331
4 changed files with 50 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

61
src/composables/autoresize.ts
View File

@ -1,10 +1,5 @@
import { watch, type Ref, type PropType } from "vue-demi";
import { throttle } from "echarts/core";
import {
addListener,
removeListener,
type ResizeCallback
} from "resize-detector";
import { type EChartsType } from "../types";
type AutoresizeProp =
@ -19,28 +14,50 @@ export function useAutoresize(
autoresize: Ref<AutoresizeProp | undefined>,
root: Ref<HTMLElement | undefined>
): void {
let resizeListener: ResizeCallback | null = null;
watch(
[root, chart, autoresize],
([root, chart, autoresize], _, onCleanup) => {
let ro: ResizeObserver | null = null;
watch([root, chart, autoresize], ([root, chart, autoresize], _, cleanup) => {
if (root && chart && autoresize) {
const autoresizeOptions = autoresize === true ? {} : autoresize;
const { throttle: wait = 100, onResize } = autoresizeOptions;
if (root && chart && autoresize) {
const { offsetWidth, offsetHeight } = root;
const autoresizeOptions = autoresize === true ? {} : autoresize;
const { throttle: wait = 100, onResize } = autoresizeOptions;
const callback = () => {
chart.resize();
onResize?.();
};
let initialResizeTriggered = false;
resizeListener = wait ? throttle(callback, wait) : callback;
addListener(root, resizeListener);
}
const callback = () => {
chart.resize();
onResize?.();
};
cleanup(() => {
if (root && resizeListener) {
removeListener(root, resizeListener);
const resizeCallback = wait ? throttle(callback, wait) : callback;
ro = new ResizeObserver(() => {
// We just skip ResizeObserver's initial resize callback if the
// size has not changed since the chart is rendered.
if (!initialResizeTriggered) {
initialResizeTriggered = true;
if (
root.offsetWidth === offsetWidth &&
root.offsetHeight === offsetHeight
) {
return;
}
}
resizeCallback();
});
ro.observe(root);
}
});
});
onCleanup(() => {
if (ro) {
ro.disconnect();
ro = null;
}
});
}
);
}
export const autoresizeProps = {