使用react-query的useMutation时出现未捕获运行时错误，账单上传Hook排查无果

我编写了一个用于上传账户账单的自定义Hook，但它抛出的错误没有明确提示信息。我已清理并重构了相关Hook，但问题仍未解决。

最初实现 #

export const useUploadStatement = () => {
const { refetch } = useGetStageOneTransactions();

return useMutation(uploadStatement, {
    onSuccess: (data) => {
        console.log("Upload successful:", data.message);
        refetch();
    },
    onError: (error) => {
        handleError(error, "Error uploading. Please check your network and retry!!!");
    },
});
};

修改后的实现 #

我曾以为问题出在直接将uploadStatement传入useMutation，于是做了如下修改，但问题依旧：

import { useMutation, useQuery } from "@tanstack/react-query";
import Utils from "../shared/localStorage";
import toast from "react-hot-toast";
import { 
approveStageOne, 
approveStageTwo, 
getStageOneList, 
getStageTwoList, 
revertRecord, 
uploadStatement 
} from "../apis/reconciliation";

// 处理API错误的工具函数
const handleError = (error, defaultMsg) => {
const message = error.response?.data?.msg || "An unexpected error occurred";
const errorMsg = error.response?.status === 500 ? defaultMsg : message;

toast.error(errorMsg, { position: "top-right" });
console.error(defaultMsg, error.response?.data?.error || message);
};

export const useUploadStatement = () => {
const { refetch } = useGetStageOneTransactions();

return useMutation((data) => uploadStatement(data), {
onSettled: () => {
refetch();
},
onError: (error) => {
handleError(error, "Error uploading. Please check your network and retry!!!");
},
onSuccess: (data) => {
console.log("Upload successful:", data.message);
},
});
};

内容的提问来源于stack exchange，提问作者Haptle Hq