[P1/高] useKeyboardShortcuts 14 个快捷键全局监听未区分 input 焦点 #39

New Issue

2026-07-21T21:56:04+08:00

thzxx commented

2026-07-21 21:56:04 +08:00

问题类型

缺陷 / 高 / 前端组件

文件位置

src/hooks/useKeyboardShortcuts.ts

问题描述

useKeyboardShortcuts 注册 14 个全局快捷键，监听 window keydown 事件，未检查事件目标是否为 input/textarea/contentEditable：

用户在输入框输入字符触发快捷键
如输入 / 触发命令模式、Ctrl+K 触发搜索
用户无法在输入框中输入这些字符

影响

输入框无法输入冲突字符
用户体验差

建议修复

function isInputTarget(e: KeyboardEvent): boolean {
  const target = e.target as HTMLElement;
  return ['INPUT', 'TEXTAREA'].includes(target.tagName)
    || target.isContentEditable;
}

document.addEventListener('keydown', (e) => {
  // 单字符快捷键在 input 中禁用
  if (isInputTarget(e) && e.key.length === 1 && !e.ctrlKey && !e.metaKey) {
    return;
  }

  // Ctrl+K 等组合键仍可触发
  handleShortcut(e);
});

或使用 react-hotkeys-hook 等库（符合开发规范）。

## 问题类型缺陷 / 高 / 前端组件 ## 文件位置 `src/hooks/useKeyboardShortcuts.ts` ## 问题描述 useKeyboardShortcuts 注册 14 个全局快捷键，监听 window keydown 事件，未检查事件目标是否为 input/textarea/contentEditable： - 用户在输入框输入字符触发快捷键 - 如输入 `/` 触发命令模式、`Ctrl+K` 触发搜索 - 用户无法在输入框中输入这些字符 ## 影响 - 输入框无法输入冲突字符 - 用户体验差 ## 建议修复 ```ts function isInputTarget(e: KeyboardEvent): boolean { const target = e.target as HTMLElement; return ['INPUT', 'TEXTAREA'].includes(target.tagName) || target.isContentEditable; } document.addEventListener('keydown', (e) => { // 单字符快捷键在 input 中禁用 if (isInputTarget(e) && e.key.length === 1 && !e.ctrlKey && !e.metaKey) { return; } // Ctrl+K 等组合键仍可触发 handleShortcut(e); }); ``` 或使用 react-hotkeys-hook 等库（符合开发规范）。

thzxx added the ??????? labels 2026-07-21 21:56:04 +08:00

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: MetonaTeam/metona-ai-desktop#39