Simplemente instanciando el siguiente código en otros componentes
import React, { useState, useCallback, useEffect } from 'react'; import useWebSocket, { ReadyState } from 'react-use-websocket'; export const WebsocketHandler = () => { const { lastJsonMessage, readyState } = useWebSocket('ws://127.0.0.1:8001/ws', { shouldReconnect: (closeEvent) => { return true; }, reconnectAttempts: 99999, reconnectInterval: 5000 }); const [isResponsive, setIsResponive] = useState(true); useEffect(() => { console.log("lastJsonMessage: " + JSON.stringify(lastJsonMessage)); }, [lastJsonMessage]) useEffect(() => { console.log("readyState: " + readyState); }, [readyState]) return isResponsive; };Recibí renderizaciones o, para ser más precisos, obtuve algunos resultados de la consola de mis otros componentes, por lo que parece que las cosas se vuelven a renderizar en cada recepción. No uso el valor de retorno, entonces, ¿qué está pasando aquí? ¿Cómo puedo evitar eso? Editar: el inicio de sesión de la consola en este componente no es el problema. La salida también vendrá de otros componentes en la aplicación.
useEffect se ejecutará cada vez que cambie el valor lastJsonMessage o readyState . useEffect es un gancho de reacción y se ejecutará después de los parámetros basados en efectos secundarios. Para obtener más información Uso del gancho de efectos
La obtención de datos, la configuración de una suscripción y el cambio manual del DOM en los componentes de React son ejemplos de efectos secundarios. Ya sea que esté o no acostumbrado a llamar a estas operaciones "efectos secundarios" (o simplemente "efectos"), es probable que las haya realizado antes en sus componentes.
Si está familiarizado con los métodos de ciclo de vida de la clase React, puede pensar en useEffect Hook como componenteDidMount, componenteDidUpdate y componenteWillUnmount combinados.
Si no desea iniciar sesión, elimine ambos useEffects. si quieres iniciar sesión en la consola una vez
useEffect(() => { console.log("lastJsonMessage: " + JSON.stringify(lastJsonMessage)); console.log("readyState: " + readyState); }, [])pero este código puede querer cambiar según su deseo