<p><br />></p>
const searchInvoiceList = async (
plantLoc:字串,
發票選項:字串
)=> {
讓資料:InvoiceData[] = [];
等待 axios
.get(`${linkURL}inv/getControlList/${plantLoc}/${invoiceOption}`)
.then((響應) => {
資料=回應.data.sqlData;
})
.catch((錯誤) => console.error(錯誤));
返回數據;
};
const fetchInvoices = useQuery({
查詢鍵:[
“發票數據”,
plantLocationOptionChecked.value,
發票選項檢查.值,
],
查詢Fn: () =>
搜尋發票列表(
plantLocationOptionChecked.value,
發票選項檢查值
),
啟用:假,
重試:0,
});
如果(fetchInvoices.isSuccess){
if (fetchInvoices.data.length === 0) {
toast.error("搜尋結果為空");
}
setFetchedInvoiceData(fetchInvoices.data);
}
如果(fetchInvoices.isError){
console.log(fetchInvoices.error);
}</pre>
<p>我有一個按鈕,有一個onClick事件,調用fetchInvoices.refetch()時出現錯誤。第一個錯誤是「重新渲染次數過多。React限制了渲染次數以防止無限循環。」如果我去掉<code>setFetchedInvoiceData(fetchInvoices.data);</code>且佇列返回為0,它會觸發我的react-hot-toast函數<code>toast.error("搜尋結果為空");< ;/code> 但然後我會收到警告「在渲染不同的元件(App
」)時無法更新元件(Ie
)」。我做錯了什麼,如何修復這個問題?</p>
在沒有查看您整個元件的程式碼的情況下,很難為您提供最佳解決方案,但是目前在這裡我看到您在每次重新渲染時都在
fetchInvoices.isSuccess
上運行條件,解決的最佳方法是將其新增至useEffect
中,如下所示: