所以我通過套接字從后端接收資料，然后將資料（專案）推送到陣列，但如果變數為真（意味著它已暫停）我不想將專案推送到陣列。
const [sales, setSales] = useState([])
const [paused, setPaused] = useState(false);
const handlePush = (dt) => {
if(paused) return;
let data = dt.itemListed.data
let obj = {
name: dt.itemListed.data.item.metadata.name,
data
}
if (sales.findIndex(i => i.name === dt.itemListed.data.item.metadata.name) > 0) return;
if (sales.length >= 10) sales.pop();
setSales(prevState => [obj, ...prevState])
}
useEffect(() => {
socket.on("itemListed", (dt) => {
handlePush(dt);
})
}, [socket])
變數 paused 設定為 true，我已經在除錯它，并且我還在螢屏上顯示了一個文本，說明它是否暫停。此外，我檢查陣列大小是否為 10 的代碼也不起作用。
代碼運行良好，但后來我更改為 socket.io-client lib，它停止作業。
我認為正在發生的事情是 useEffect 只被“讀取”一次，它忽略了期貨驗證，它一直在推動專案。
我能做些什么？
uj5u.com熱心網友回復：
這應該可以解決您的問題
useEffect(() => {
socket.on("itemListed", (dt) => {
handlePush(dt);
})
return () => {
socket.off("itemListed") // cleanup
};
}, [socket, handlePush])
您的 useEffect 正在偵聽使用舊pause值的以前版本的 handlePush，所以這就是它仍然能夠推送的原因。
如果您將該函式添加handlePush為 useEffect 的依賴項，它將在每次 handlePush 更改時重新運行，因此您將擁有最新的函式。
為了提高性能，您還應該利用函式useCallback()上的鉤子。handlePush()
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/482897.html