如何在react组件或自定义钩子中获得GraphQl错误?

Question

我使用的是@apollo/client，一切正常。在我的索引里。我正在记录Graphql错误

const errorLink = onError(({ graphQLErrors, networkError }) => {
if (graphQLErrors) {
graphQLErrors.map(({ message, extensions }) => {
console.log(`[GraphQL error]: Message: ${message}, Location: ${extensions.code}`);
});
}
if (networkError) {
handle network error
console.log(networkError);
}
});

，我能够看到由graphql查询抛出的确切错误。但是我不能在我的组件中得到这些错误。

我有一个自定义钩子来调用查询和错误，我已经实现了以下代码

const { loading: letLoading, error: letError, data: letData } = useQuery(fetchTypes, {
variables: { input: { country: 'deu' }, errorPolicy: "all" },
});

function fetchLETService() {
setLetStatus({ letLoading });
if (letError) {
console.log(letError)
}
if (letData) {
setLetStatus({ letLoading: false, letData: letData.types });
}
}

但是我得到的都是

响应不成功:Received status code 400

我期待下面的错误，我得到的index.ts

[GraphQL错误]:消息:变量"$input"得到无效值{国家:"deu"};场"accountProduct"所需类型"String!"没有提供。，位置:BAD_USER_INPUT

Answer 1

尝试使用onError函数。希望能有所帮助

const { loading: letLoading, error: letError, data: letData } = useQuery(fetchTypes, {
variables: { input: { country: 'deu' }, errorPolicy: "all" },
onError: (error) => {
console.log(error)
}
});