我不明白为什么useEffect中的handler运行多次,我知道我的useEffect是第一次运行,但我不明白为什么 *useEffect中的handler运行多次。
useEffect(() => {
const keys = [];
const handler = (e) => {
keys.push(e.keyCode);
const getItemsFiltered = keys
.slice(0)
.slice(Math.max(keys.length - 3, 0))
.join("");
if (getItemsFiltered == 1716113) {
setShow(true);
}
console.log(getItemsFiltered);
if (getItemsFiltered == 1716114) {
document.getElementById("textField").focus();
}
};
document.addEventListener("keydown", handler, false);
return () => document.removeEventListener("keydown", handler, false);
}, []);
1条答案
按热度按时间ldioqlga1#
无论你点击页面的哪个位置,你的处理函数都会对每一次按键做出React!你可以点击组件之外的部分,但是你的处理函数仍然会运行,因为你把你的处理函数作为一个事件监听器附加到了整个HTML页面上。
如果只想在单击组件时运行
handler
函数,可以执行以下操作:您也可以使用React的useRef钩子来实现相同的效果。