在React查询中,每个响应都被视为成功。
Axios是用来调用API请求的,这里是一个axios组件。
export const callAxios = async ({
url,
method,
data,
headers,
params,
responseType,
}: CallAxiosAPI) => {
const config: AxiosRequestConfig = {
method: method || 'GET',
url: `${baseUrl}${url}`,
headers: {
'Content-Type': 'application/json',
'Access-Control-Allow-Origin': '*',
Authorization: accessToken !== null ? `Bearer ${accessToken}` : '',
...headers,
},
data,
params,
responseType,
}
return axios(config)
.then((res: AxiosResponse<any, any>) => {
return res
})
.catch(err => {
return err
})
}
下面是使用useMutation的示例
const adjustProfit = useMutation(
['adjustProfit'],
(params: { configurationId: string; configurationPriceId: number; data: IAdjustType }) => {
return PricingQueries.adjustProfit(
parseFloat(String(params.configurationId)),
params.configurationPriceId,
params.data,
)
},
{
onSuccess: () => {
refetch()
},
onError: () => {
toast.error(t(`message.adjust_price_failed`))
},
},
)
即使调用了onSuccess也有错误。
1条答案
按热度按时间kx7yvsdv1#
问题出在
.catch
上,通过捕获一个错误(因为你想记录),然后“不”重新抛出这个错误,你就把这个错误转换成了一个已解决的Promise,所以你实际上从来没有把这个错误返回给useQuery。修复方法是删除
catch
并使用onError
回调进行日志记录,或在日志记录后重新引发错误。这个陷阱太常见了,我已经把它添加到我的FAQ帖子中:https://tkdodo.eu/blog/react-query-fa-qs#why-do-i-not-get-errors-