Reactjs 我是否需要在每个react组件中注册窗口事件侦听器？

我有一个用ReactJS编写的应用程序，有时我不得不添加窗口调整事件监听器，现在我有了大约5个组件，每个组件都有自己的窗口调整事件监听器，有没有更好的方法来处理这个问题，我想我缺少了一个设计模式或一些可以处理我的情况的东西

---

我们将非常感谢您的帮助

我在我的

App.js

文件中使用了一个窗口调整事件监听器，让它更新我的

高度

和

宽度

，并将该状态传递给需要它的组件。这是我使用的函数：

  useEffect(() => {
    const handleResize = () => {
      setWidth(window.innerWidth)
      setHeight(window.innerHeight)
    }
    window.addEventListener('resize', handleResize)
    return () => { window.removeEventListener('resize', handleResize) }
  }, [])

---

如果您有许多组件彼此没有直接连接，但在我的情况下，使用状态很好，那么最好使用

上下文

来存储

高度

和

宽度

。

只要您正在清理订阅，就可以了

如果您真的关心它，您可以使用设置单个订阅，允许子视图使用该值，而无需自己订阅

您也可以只订阅父组件并通过道具向下传递值。但一定要用这种方法使道具通过时保持浅。不要将道具传递给曾孙视图等。如果不小心，可能会导致大量不必要的重新渲染