useMousePressed

Tags:

一个用于跟踪鼠标按压状态的 React Hook。

演示

源码
Mouse Pressed:
false
Source Type:
null
Mouse Pressed (target):
false
Source Type (target):
null
Target

用法

请查看 API。

源码

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

API

const { pressed, sourceType } = useMousePressed(elementTarget, options)

元素目标 ElementTarget

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

更多详情,请参见 ElementTargetElementTarget 类型

选项 Options

export type MousePressedOptions = { /** * 是否监听触摸事件 * * @defaultValue true */ touch?: boolean /** * 是否监听拖拽事件 * * @defaultValue true */ drag?: boolean /** * 是否使用事件捕获 * * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#capture MDN - addEventListener#capture} * * @defaultValue false */ capture?: boolean /** * 鼠标按压的初始值 * * @defaultValue false */ initialValue?: boolean /** * 目标元素 * * @defaultValue () => window */ target?: ElementTarget }

返回值

export type UseMousePressedReturns = { /** * 鼠标是否被按压 */ pressed: boolean /** * 鼠标按压的来源类型 */ sourceType: UseMouseSourceType }