使用 Key ()
npm i @accessible/use-key
处理的反应钩 keydown 具体活动 event.key 数值。 还有
规范非标准 event.key 从IE到其现代等价值.
快速启动
import * as React from 'react'
import useKey from '@accessible/use-key'
const Component = () => {
const ref = React.useRef(null)
// Listens to keydown events on the `ref` above
useKey(ref, {
// Logs event when the Escape key is pressed
Escape: console.log,
// Logs "Key was pressed: Enter" to the console when Enter is pressed
Enter: (event) => console.log('Key was pressed:', event.key),
})
// Listens to keydown events on the window
useKey(window, {
// Logs event when the Escape key is pressed
Escape: console.log,
// Logs "Key was pressed: Enter" to the console when Enter is pressed
Enter: (event) => console.log('Key was pressed:', event.key),
})
return <div ref={ref} />
}
API 密码
使用Key( 目标, 处理器)
参数
| 参数 | 类型 | 需要吗? | 说明 |
|---|---|---|---|
| 目标 | React.RefObject<T> | T | Window | Document | null | 对 | 反应参考,元素, window,或 document 添加密钥监听器到 |
| 处理者 | Record<string, (event?: KeyboardEvent) => any> | 对 | 匹配密钥的映射 event.key 你想听的字符串。 每个密钥的值应为事件听众. |
回返 void
自由主义
麻省理工学院