useMousePressed
一个用于跟踪鼠标按压状态的 React Hook。
演示
源码Mouse Pressed (target): false
Source Type (target): null
Target
用法
请查看 API。
源码
API
const { pressed, sourceType } = useMousePressed(elementTarget, options)
元素目标 ElementTarget
ElementTarget
是一个联合类型,代表可以被定位的各种元素。
更多详情,请参见 ElementTarget 或 ElementTarget 类型。
选项 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
}