Quiero almacenar el zócalo para poder usarlo en diferentes componentes. Cuando configuro el socket por primera vez en socket.io después de iniciar sesión, configuro el socket como un estado en el estado "socket" y luego lo almaceno en localStorage.
useEffect(() => { if(!socket) { setSocket(io(backendLink)); }; }, []) useEffect(() => { socket?.emit("newUser", localStorage.getItem('authToken')); localStorage.setItem('socket', JSON.stringify(socket)); }, [socket])Luego en diferentes componentes, donde inicialmente no configuré el zócalo. Yo uso lógica como esta:
useEffect(() => { if(!socket) socket = localStorage.getItem('socket'); socket.emit(...) }, [userID])Arriba, si el socket pasado como accesorios que se almacenó en estado es nulo, restauro el socket desde localStorage y lo uso para emitir. Sin embargo, obtengo TypeError no capturado: Convertir estructura circular a JSON.
Por lo que entendí, esto se debe a que usé JSON.stringify en algo que no se puede convertir y almacenar en localStorage de esta manera, es decir, socket. Quiero usar Vanilla Reactjs para usar el socket como archivos diferentes del archivo que usé setSocket (io (backendLink)). ¿Cómo usar socket.io en diferentes componentes con vainilla reactJS (sin contexto, completamente vainilla)?
No debe encadenar dichos objetos, si desea hacer referencia a ellos en su aplicación, solo debe colocarlos dentro de un contexto React después de guardarlos en el estado. De esa manera, puede acceder a él desde cualquier lugar que desee a través de su aplicación. También hay otras opciones, pero esa es la más segura.