简体中文

useHover

Tags:

Sensors

一个用于追踪元素悬停状态的 React 钩子。

演示

源码

isHovered:

false

Hover me 😭

用法

请查看 API。

源码

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

🪝 Hook 🎨 Demo 📄 Document

API

const isHovered = useHover(elementTarget, options)

元素目标 ElementTarget

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

更多详情，请参见 ElementTarget 或 ElementTarget 类型。

选项 Options

export type UseHoverOptions = {
  /**
   * 触发 `onEnter` 事件前的延迟时间（毫秒）
   */
  delayEnter?: number
  /**
   * 触发 `onLeave` 事件前的延迟时间（毫秒）
   */
  delayLeave?: number
  /**
   * 鼠标进入目标元素时的事件处理器
   */
  onEnter?: (e: MouseEvent) => void
  /**
   * 鼠标离开目标元素时的事件处理器
   */
  onLeave?: (e: MouseEvent) => void
  /**
   * 鼠标进入或离开目标元素时的事件处理器
   */
  onChange?: (isHovered: boolean, e: MouseEvent) => void
}

返回值

一个用于指示目标元素是否被悬停的 boolean 值。

ON THIS PAGE

#useHover

#演示

#用法

#源码

#API

#元素目标 ElementTarget

#选项 Options

#返回值

useHover

演示

用法

源码

API

元素目标 ElementTarget

选项 Options

返回值