Reactjs 如何使用react hook useeffect添加依赖于状态的事件处理程序？

我有一个authorize组件，包括另一个组件——用户名、密码等字段。我试图创建react hook Useffect，在这里我想添加一个subscribe on“X”keyDown事件。在这个事件中，我想执行Authorize（）函数，它位于组件体（而不是钩子体）中，并且取决于Authorize组件状态

因此，我找到的唯一解决方案是：

  useEffect(() => {
    const handleKeyDown = (event) => {
      event.key === 'X' && defineIsAuthorizationAvailable() && authorize()
    }
    window.addEventListener('keydown', handleKeyDown)
    return () => window.removeEventListener('keydown', handleKeyDown)
  }) 

---

但我不认为这是正确的，因为这种订阅/取消订阅会在用户状态的每次更改时执行。请提供帮助。

因此，您希望根据布尔状态值运行

useffect

中的特定函数，对吗？ 如果是这样，您可以在

useffect

挂钩中使用条件，并在某些状态更改时重新渲染。 例如，类似这样的内容：

 useEffect(() => {
if(authorizeBoolean) {
const handleKeyDown = (event) => {
      event.key === 'X' && defineIsAuthorizationAvailable() && authorize()
    }
    window.addEventListener('keydown', handleKeyDown)
    return () => window.removeEventListener('keydown', handleKeyDown)
}

}, [authorizeBoolean]);

---

回答得好。只是

不应该限制添加侦听器。相反，应该只限制
authorize（）
。如果您的意思是我只需要在组件装载后切换authorizeBoolean一次，我理解，当authorize（）执行时，state item user将有一个值=initialValue，这是不正确的。