Appearance
useScrollTo
▸ useScrollTo(options
): UseScrollToResult
当滚动页面到达指定阈值时,该 Hook 将控制一个元素的显示与隐藏,并提供页面滚动控制方法
参数
Name | Type |
---|---|
options | UseScrollToOptions |
返回值
- 包含一个表示元素是否可见的响应式引用和用于控制页面滚动的方法的对象。
示例
ts
const {visible, pageScrollTo} = useScrollTo({
visibleThreshold: 200, // 当页面滚动超过 200 时 visible 为 true
})
pageScrollTo({
scrollTop: 0, // 滚动到顶部
})
示例
ts
const {visible, pageScrollTo} = useScrollTo({
observe: '.card' // 当这个元素滚动到视窗顶部 - 100px 时,visible 为 true
observeOffset: {top: -100}
})
pageScrollTo({
selector: '.line', // 滚动到这个元素的上面 150px 的位置
offsetTop: 150,
})