如何以反应查询的方式处理错误？
如何以反应查询的方式处理错误？
提问于 2022-03-19 09:52:19
由于react查询在很大程度上基于声明式方法，所以我在所有示例中看到的错误处理如下所示：
function Todos() {
const { isLoading, isError, data, error } = useQuery('todos', fetchTodoList)
if (isLoading) {
return <span>Loading...</span>
}
if (isError) {//If there is an error, render different JSX
return <span>Error: {error.message}</span>
}
return (
<ul>
{data.map(todo => (
<li key={todo.id}>{todo.title}</li>
))}
</ul>
)
}但是，如果我只想显示一个警告，万一出错呢？或者，我使用的是一些错误处理接口，它有一个命令式触发器？就像这样：
if (isError) alert(`An error has occurred: ${error.message}`)在本例中，我得到了2警报。某些东西会导致组件重新呈现，这当然会导致“重复”错误处理。
为什么这对我很重要？因为我的错误处理逻辑可能不是基于在我的组件中呈现特定的JSX，而是基于一些手动的一次性触发器。警报只是一个基本的例子。
如有任何建议，将不胜感激！
回答 1
Stack Overflow用户
回答已采纳
发布于 2022-03-19 12:02:32
您试过使用onError回调吗？
看起来是这样的：
const useTodos = () =>
useQuery(['todos'], fetchTodos, {
// ⚠️ looks good, but is maybe _not_ what you want
onError: (error) =>
toast.error(`Something went wrong: ${error.message}`),
})您知道，对每个onError调用useQuery上的Observer回调，这意味着如果您在应用程序中调用useTodos两次，您将得到两个错误警告，即使只有一个网络请求失败。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/71537128
复制相关文章
相似问题
腾讯云开发者
