Cuando ejecuto el código, se conecta a mi servidor TCP varias veces, aunque espero que se conecte solo una vez.
import React, { useEffect, useState, Component } from 'react'; import { Text, View, StyleSheet, Image, Button } from 'react-native'; import { Touchable, TouchableOpacity } from 'react-native-web'; var net = require('react-native-tcp-socket'); var cert= require('./certificate.pem'); export default function AssetExample() {; const [out, outfunc] = useState('Connecting...'); const [count, countfunc] = useState(0); const client = net.createConnection( { port: 4242, host: '192.168.1.108', tls: true, tlsCheckValidity: false, tlsCert: cert }, () => { console.log("Connected"); client.write("1"); client.write("2"); client.write("3"); client.write("4"); }) client.on("data", function (data) { console.log(data); var dat = data.toString(); countfunc(count + 1); outfunc(out + "\n" + dat); if (data == "") { console.log("discon"); } if (dat == "ACCGNT") { console.log("GRANTED"); if (dat == "ALRCON"){ client.destroy(); } }}); // client.destroy(); return ( <View> <Text>{count}</Text> <Text> {out} </Text> </View> ); }La salida también está cambiando mucho y no parece seguir el aspecto que programé. La salida parece parpadear desde muchas otras salidas.
React activa su función varias veces durante el renderizado. Pero no vuelve a representar la interfaz de usuario. por lo tanto, cualquier código js dentro de la función se ejecutará cada vez. SO para evitar que necesite mover la lógica de conexión a useEffect hook
useEffect(()=>{ // establish connection return ()=>{ // destroy connection } },[])Ahora la conexión ocurrirá solo una vez. si desea volver a conectarse en función de algún estado. agregue ese estado en la matriz de dependencia.