为啥反应 JS 挂钩 websocket onmessage 重置状态？

Posted 2023-02-16

【中文标题】为啥反应 JS 挂钩 websocket onmessage 重置状态？

【英文标题】：Why react JS hooks websocket onmessage reset state?为什么反应 JS 挂钩 websocket onmessage 重置状态？

【发布时间】：2020-07-13 22:49:44

【问题描述】：

我正在努力在 ReactJS 中使用 Web 套接字。

我遵循了这个解决方案：https://***.com/a/60161181/12962511

这个解决方案效果很好！

但是，我想知道为什么 onmessage 在 useEffect 中。

我在 useEffect 中尝试了 onmessage，其中 [] 是 componentDidMount。结果重置了我的状态，但没有从头开始启动函数，因为在这种情况下没有触发带有 [] 的 useEffect。

所以我的问题是：

将 onmessage 放入 useEffect 与 [] 或仅放入 useEffect 之间的区别。 react Hooks websocket 中 useRef 的必要性（我尝试了两种方法，在网络控制台上看起来非常相似。） - 我知道 useRef 会阻止 websocket 每次重新渲染。

我整天都在坚持这个问题。 :( 请帮帮我。

非常感谢！

【参考方案1】：

useEffect 没有依赖关系将在每次渲染时触发。由于您只需要订阅一次，它应该是空的礼节[]。 在您的示例中，useRef 仅用于暂停通过 websocket 收听消息。如果你不需要这个逻辑，你可以不用它。

【讨论】：

感谢您的回复！我已经完成了带有空依赖项 [] 的 onMessage ，它导致我的消息状态为空。另一方面，当我将 onmessage 放入 useEffect 时，并没有发生这种情况。我真的很想知道发生这种情况的原因。非常感谢！拉米尔！