Axios cancelToken，使取消的请求静默失败

Question

我正在使用react-hook-form创建一个验证帐号 onChange 的输入表单

 useEffect(() => {
    if (account_number.length >= 6) {
      verifyAccountNumber();
    }
    return () => source.cancel('Request canceled!');
  }, [account_number, bank_code, verifyAccountNumber]);

verifyAccountNumber function 在account_number和bank_code state 更改时运行。

这是实际的 function

const verifyAccountNumber = useCallback(async () => {
    setAccountLoading(true);
    setAccountError({ status: false, serverError: false });
    try {
      const account = await restAPI.get(
        `/misc/verify-account/${account_number}/${bank_code}`,
        { cancelToken: token }
      );
      setAccount(account.data.data.data.account_name);
    } catch (err) {
      console.log(err);
      if (!axios.isCancel(err)) {
        setAccountError({
          status: true,
          serverError: err.response.data.serverError,
        });
      }
    }
    setAccountLoading(false);
  }, [account_number, bank_code]);

有没有办法防止 try catch 块将取消的请求作为错误捕获？ 因为它弄乱了我的 UI/UX

Answer 1

如果你想防止捕获取消错误，你必须在你的情况下重新抛出它。

if (axios.isCancel(err)) { 
    throw err 
} else { 
    setAccountError(...) 
} 

（从评论中回答以记录此问题已解决）