30 lines
713 B
TypeScript
30 lines
713 B
TypeScript
import { onMounted, onUnmounted, ref, type Ref } from 'vue'
|
|
|
|
/** 元素可见性（配合图片懒加载/曝光统计） */
|
|
export function useIntersection(
|
|
target: Ref<Element | null | undefined>,
|
|
options?: IntersectionObserverInit,
|
|
): {
|
|
isVisible: Ref<boolean>
|
|
} {
|
|
const isVisible = ref(false)
|
|
let observer: IntersectionObserver | null = null
|
|
|
|
onMounted(() => {
|
|
const el = target.value
|
|
if (!el) return
|
|
observer = new IntersectionObserver((entries) => {
|
|
const entry = entries[0]
|
|
if (entry) isVisible.value = entry.isIntersecting
|
|
}, options)
|
|
observer.observe(el)
|
|
})
|
|
|
|
onUnmounted(() => {
|
|
observer?.disconnect()
|
|
observer = null
|
|
})
|
|
|
|
return { isVisible }
|
|
}
|