30 lines
787 B
TypeScript
30 lines
787 B
TypeScript
// useScrollDetector.ts
|
|
import type { Ref } from 'vue';
|
|
import { onBeforeUnmount, onMounted, ref } from 'vue';
|
|
|
|
export default (elementRef: Ref<HTMLElement | null | undefined>) => {
|
|
const hasVertical = ref(false);
|
|
const hasHorizontal = ref(false);
|
|
|
|
const check = () => {
|
|
const el = elementRef.value;
|
|
if (!el)
|
|
return;
|
|
hasVertical.value = el.scrollHeight > el.clientHeight;
|
|
hasHorizontal.value = el.scrollWidth > el.clientWidth;
|
|
};
|
|
|
|
onMounted(() => {
|
|
check();
|
|
const observer = new ResizeObserver(check);
|
|
observer.observe(elementRef.value!);
|
|
onBeforeUnmount(() => observer.disconnect());
|
|
});
|
|
|
|
return {
|
|
hasVertical, // 是否有纵向滚动条
|
|
hasHorizontal, // 是否有横向滚动条
|
|
check, // 检查滚动条状态
|
|
};
|
|
};
|