axios を使用して get リクエストを行うと、React Query の .isSuccess エラーが発生します

Question

const searchInvoiceList = async (
  plantLoc: 文字列、
  invoiceオプション: 文字列
) => {
  データを許可します: InvoiceData[] = [];
  アクシオスを待つ
    .get(`${linkURL}inv/getControlList/${plantLoc}/${invoiceOption}`)
    .then((応答) => {
      データ = 応答.データ.sqlData;
    })
    .catch((エラー) => console.error(エラー));
  データを返す。
};

  const fetchInvoices = useQuery({
    クエリキー: [
      "請求書データ",
      plantLocationOptionChecked.value、
      invoiceOptionChecked.value、
    ]、
    queryFn: () =>
      searchInvoiceList(
        plantLocationOptionChecked.value、
        invoiceOptionChecked.value
      ）、
    有効: false、
    再試行: 0、
  });
  if (fetchInvoices.isSuccess) {
    if (fetchInvoices.data.length === 0) {
      トースト.error("搜索結果は空");
    }
    setFetchedInvoiceData(fetchInvoices.data);
  }
  if (fetchInvoices.isError) {
    console.log(fetchInvoices.error);
  }

onClick イベントが 1 つあり、fetchInvoices.refetch() を使用するときに発生する問題が 1 つあります。最初の問題は「再実行回数が多すぎます。無制限の循環を防ぐために React が制限回数を制限しています。」 setFetchedInvoiceData(fetchInvoices.data);そして数集合が 0 を返します、它会触発我の react-hot-toast関数数toast.error("搜検索結果は空");< ;/code>しかしその後、「異なる構成要素（App）を汚染しているときに構成要素（Ie）を不正に更新できません」という警告が表示されます。この問題をどのように修正しますか?

Answer 1

コンポーネントのコード全体を見ずに最適な解決策を提供することは困難ですが、現在、再レンダリングのたびに fetchInvoices.isSuccess が発生していることがわかります。 実行条件、解決するための最良の方法次のように useEffect に追加します:

リーリー