反应 useEffect 卸载清理问题答案

【问题标题】：React useEffect unmount cleanup issue反应 useEffect 卸载清理问题
【发布时间】：2021-11-23 16:24:01
【问题描述】：

所以我有一个组件运行 useEffect 函数并清理了一些 socket.io。

当组件初始化时，它会初始化但会立即运行 socket.disconnect()。理想情况下，它应该只在我离开该页面时断开连接，但现在只需打开带有组件初始化套接字的页面并立即关闭连接，因此停止网络应用程序接收进一步的广播.. 是 React 的新手并尝试获取理解为什么组件认为它已卸载但它在 DOM 上清晰可见？

在 useEffect 中添加 socket.connect() 也没有解决它:( 它只是保持断开连接。

useEffect(()=> {
socket.on("abc", (xy)=> "do something")

return socket.disconnect()}, [])

【问题讨论】：

标签： reactjs socket.io

【解决方案1】：

你的效果应该是返回一个函数。试试这样，

useEffect(() => {
    socket.on("abc", (xy)=> "do something");
    return (() => {
       socket.disconnect()
    })
}, [])

【讨论】：

riiiiight .....当然。明白那里的逻辑。这教会我不要参考 youtube 视频教程。谢谢。