如何解决如何在 React useEffect 中正确清理?
我有一个从 Apollo 订阅接收数据的 react 函数。
对于每个订阅,都会创建一个网络连接。我需要在组件卸载时销毁网络连接,但在新订阅到达时不需要。
const { data } = useSubscription(...);
const {connections,setConnections} = useState([]);
const createNetworkConnection = (id) => {
const connection = new CreatSomeConnection(id);
connection.onMessage = () => doSomeOtherMutations();
return connection;
};
useEffect(() => {
setConnections((current) => [...current,createNetworkConnection(id)]);
},[data])
如果我将清理添加到上面的钩子中,那么它会在每次新订阅到达时运行,这不是我想要的(我还不想破坏其他网络连接)。
如果我添加另一个钩子 useEffect(() => () => doCleanUp(),[])
,那么清理函数的范围没有最新的 connections
(或任何,实际上)。
我认为解决这个问题的唯一方法是使用我试图避免的 useRef
?
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。