當我運行代碼時，它會多次連接到我的 TCP 服務器，即使我希望它只連接一次
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>
);
}
輸出也發生了很大變化，它似乎不符合我對其進行編程的方式。輸出似乎從許多其他輸出中閃爍。
uj5u.com熱心網友回復：
React 在渲染程序中多次觸發你的函式。但不會重新渲染 UI。所以函式內的任何js代碼每次都會被執行。所以為了避免你需要將連接邏輯移動到 useEffect 鉤子
useEffect(()=>{
// establish connection
return ()=>{
// destroy connection
}
},[])現在連接只會發生一次。如果您根據某些狀態重新連接。在依賴陣列中添加該狀態。
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/487548.html
標籤：javascript 反应式 功能 tcp
上一篇：如何解決遞回函式中的索引錯誤？