搜索

首页  >  问答  >  正文

React Query的.isSuccess在我使用axios进行get请求时发生错误

<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,
  });
  if (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>
P粉153503989P粉153503989471 天前467

全部回复(1)我来回复

  • P粉517090748

    P粉5170907482023-08-16 18:54:18

    在没有查看您整个组件的代码的情况下,很难为您提供最佳解决方案,但是目前在这里我看到您在每次重新渲染时都在fetchInvoices.isSuccess上运行条件,解决的最佳方法是将其添加到useEffect中,如下所示:

    useEffect(() => {
          if (fetchInvoices.isSuccess) {
            if (fetchInvoices.data.length === 0) {
              toast.error("搜索结果为空");
            }
            setFetchedInvoiceData(fetchInvoices.data);
          }
         if (fetchInvoices.isError) {
           console.log(fetchInvoices.error);
         }
       }, [fetchInvoices.isSuccess, fetchInvoices.isError])

    回复
    0
  • 取消回复