Tengo un socket definido en el backend que acepta solicitudes continuas para el servidor. Ahora, quiero enviar solicitudes continuamente a la API de back-end, hasta que se presione un botón de parada. Entonces, puedo usar un bucle (MALA PRÁCTICA). El problema es que nunca comprueba el estado actualizado. Entonces, ¿cómo puedo implementar esto con la mejor práctica de codificación posible?
const [close, closeButton] = useBoolean() // State for close button let req; proto ? req = 'UDP' : req = 'TCP' // There is a checkbox to select the connection mode. proto is a state. console.log(`Close button: ${close}`) // This state updates correctly. const onSubmit = async () => { while(!close) console.log(`Close button: ${close}`) // This state does not update while staying in the loop. const res = await serverRequest(req) console.log(res.messageFromClient) } }Entonces, ¿cómo debo hacer que esto se ejecute indefinidamente hasta que se presione el botón de cerrar? ¿Debo usar redux para el estado global o hay una mejor manera que no sea el ciclo while?
Código de cliente para referencia:
const onSubmit = async values => { const clientData = await clientRequest({proto, JSON.stringify(values.message)}) console.log(clientData) console.log(values.message) }Este código envía datos del cliente cada vez que el mensaje se envía desde el cliente. Entonces, para ejecutar el cliente, el servidor debe escuchar continuamente las solicitudes. Cada vez que el cliente envía una solicitud, el servidor debe obtener una respuesta e iniciar el servidor una vez más, hasta que se cambie el modo de conexión o se presione el botón de cierre en el código del lado del servidor.
Si es absolutamente necesario usar este código y desea que acceda al estado actualizado, puede almacenar en caché una copia del estado en una referencia de React y consultarlo en su lugar.
const [close, closeButton] = useBoolean() // State for close button const closeRef = React.useRef(); React.useEffect(() => { closeRef.current = close; // <-- cache close value when it updates }, [close]); const onSubmit = async () => { while(!closeRef.current) // <-- cached close state value console.log(`Close button: ${closeRef.current}`) const res = await serverRequest(req) console.log(res.messageFromClient) } }