32 lines
782 B
TypeScript
32 lines
782 B
TypeScript
|
import { ref, onUnmounted } from 'vue'
|
||
|
|
|
||
|
|
const DEFAULT_HIDE_AFTER_MS = 900
|
||
|
|
|
||
|
|
/** 滚动条默认隐藏，发生滚动后短暂显示，停止滚动一段时间后自动隐藏 */
|
||
|
|
export function useFlashScrollbar(hideAfterMs = DEFAULT_HIDE_AFTER_MS) {
|
||
|
|
const scrollbarVisible = ref(false)
|
||
|
|
let hideTimer: ReturnType<typeof setTimeout> | null = null
|
||
|
|
|
||
|
|
function clearHideTimer() {
|
||
|
|
if (hideTimer != null) {
|
||
|
|
clearTimeout(hideTimer)
|
||
|
|
hideTimer = null
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
function onScrollableScroll() {
|
||
|
|
scrollbarVisible.value = true
|
||
|
|
clearHideTimer()
|
||
|
|
hideTimer = setTimeout(() => {
|
||
|
|
scrollbarVisible.value = false
|
||
|
|
hideTimer = null
|
||
|
|
}, hideAfterMs)
|
||
|
|
}
|
||
|
|
|
||
|
|
onUnmounted(() => {
|
||
|
|
clearHideTimer()
|
||
|
|
})
|
||
|
|
|
||
|
|
return { scrollbarVisible, onScrollableScroll }
|
||
|
|
}
|