這不是重復的，因為我嘗試添加更新程式功能但它不起作用這是我擁有的代碼
const [counter, setCounter] = useState(0);
useEffect(()=>
{
const fetchSessions =async ()=>
{
instance.events.sessionCreated({fromBlock:0}).on("data",async (evt)=>{ handleSessionCreatd(evt)})
}
fetchSessions();
},[]);
const handleSessionCreatd =async (event)=>
{
let index = event.returnValues.id -1;
let session = await instance.methods.sessions(index).call();
console.log("index is at:",index);
setCounter(counter => counter 1);
//setCounter(prev=>index);
console.log("counter is at",counter);
}
我想對新創建的會話執行回呼，所以我將它放入useEffect()空陣列中以僅注冊一次回呼（因為 eventListner 不斷自動更新），索引的值更新成功，但是我的計數器的值沒有更新.
如何更新我的計數器？
即使我將 useEffect() 與空陣列一起使用，但輸出有點奇怪，因為它會列印兩次執行：
索引為 0
計數器為 0
指數為 1
計數器為 0
.
.
.
指數為 10
計數器為 0
然后它從 0 開始再次列印上一個串列（完全相同的串列，計數器仍然不更新），是什么導致了這種行為？
ps：事件來自web3.js。即使我取消注釋第二個 setState 它仍然不會增加（我認為它可能仍然以某種方式從閉包中獲取捕獲的值）
uj5u.com熱心網友回復：
正如我所看到的，您在初始化時僅傳遞一次處理程式，并且counter處理程式內部的值將從閉包中檢索。由于初始化時counter為 0，因此在每個日志中，您將從在您傳遞事件處理程式的第一次（也是唯一一次）時構造的閉包中列印相同的 0。嘗試在事件處理程式之外登錄并查看counter. 如果您確實需要counter事件處理程式，那么您將需要在 useEffect 中包含一些依賴項，以便重建您正在讀取的閉包。
uj5u.com熱心網友回復：
setState 是異步的，這意味著console.log在它改變之前不能顯示該值
uj5u.com熱心網友回復：
解決方案是在 index.js 中禁用 React.strictMode （只需洗掉該行），此外，由于 setState 是異步的，因此執行轉移到控制臺日志而不必執行 setState 因此它輸出舊值。因此，為了獲得最終值，只需在 useEffect 之外使用 console.log 即可，它還會為您提供有關 React 重新渲染次數及其優化技術的線索
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/494995.html
標籤：javascript 反应 web3js
下一篇：如何使用AnimatedSwitcher和SlideTransition使Widget離開螢屏右側而另一個來自左側？