useScrollLock

Tags:

一个 React Hook,用于帮助锁定或解锁一个元素的滚动行为。

演示

源码
isLocked:
false

用法

请查看 API。

源码

点击下方链接跳转 GitHub 查看源代码。

API

const [isLocked, setLocked, actions] = useScrollLock(elementTarget, initialState)

元素目标 ElementTarget

ElementTarget 是一个联合类型,代表可以被定位的各种元素。

更多详情,请参见 ElementTargetElementTarget 类型

初始状态 InitialState

一个 boolean 值,用以确定滚动锁定的初始状态。

返回值

export type UseScrollLockReturnsActions = {
  /**
   * 锁定滚动
   */
  lock(): void
  /**
   * 解锁滚动
   */
  unlock(): void
  /**
   * 切换滚动锁定状态
   */
  toggle(): void
}

export type UseScrollLockReturns = [
  /**
   * 滚动是否被锁定
   */
  isLocked: boolean,
  /**
   * 设置滚动锁定状态
   */
  setLocked: ReactSetState<boolean>,
  /**
   * 锁定/解锁滚动的操作
   */
  UseScrollLockReturnsActions,
]