停止从其他键降处理程序传播材质 UI 文本字段事件

Question

在我的 React 应用程序中，我无法停止从 Material UI TextField 传播键盘事件。

问题示例 - 按文本字段中的退格键会在我的创作环境中触发删除操作。

在材质 UI 组件中进行更改时：

<TextField onChange={handleChange} />

我尝试停止传播：

const handleChange = event => {
event.stopPropagation();
// ...
};

但这并不能阻止我的其他事件侦听器触发：

document.addEventListener("keydown", onKeyDown);
const onKeyDown = event => {
switch (event.code) {
case "Backspace":
case "Delete":
// ...
break;
}

最终没什么大不了的，因为我可以将我的键控侦听器的范围从document更改为它打算使用的canvas元素，但很好奇这里是否有建议。

Answer 1

我遇到了同样的问题，我通过在 TextField 标签中添加以下onKeyDown事件来修复它。

<TextField onChange={handleChange} onKeyDown={e=>{ e.stopPropagation()}} />