40 lines
807 B
TypeScript
40 lines
807 B
TypeScript
import { tryOnMounted, tryOnUnmounted, useDebounceFn } from '@vueuse/core'
|
|
|
|
interface UseWindowSizeOptions {
|
|
wait?: number
|
|
once?: boolean
|
|
immediate?: boolean
|
|
listenerOptions?: AddEventListenerOptions | boolean
|
|
}
|
|
|
|
function useWindowSizeFn<T>(fn: Fn<T>, options: UseWindowSizeOptions = {}) {
|
|
const { wait = 150, immediate } = options
|
|
let handler = () => {
|
|
fn()
|
|
}
|
|
const handleSize = useDebounceFn(handler, wait)
|
|
handler = handleSize
|
|
|
|
const start = () => {
|
|
if (immediate)
|
|
handler()
|
|
|
|
window.addEventListener('resize', handler)
|
|
}
|
|
|
|
const stop = () => {
|
|
window.removeEventListener('resize', handler)
|
|
}
|
|
|
|
tryOnMounted(() => {
|
|
start()
|
|
})
|
|
|
|
tryOnUnmounted(() => {
|
|
stop()
|
|
})
|
|
return { start, stop }
|
|
}
|
|
|
|
export { useWindowSizeFn, type UseWindowSizeOptions }
|