react-query with graphql-request：错误边界未运行答案

【问题标题】：react-query with graphql-request: Error boundary not runningreact-query with graphql-request：错误边界未运行
【发布时间】：2021-02-28 19:54:28
【问题描述】：

我有以下代码：

const queryClient = new QueryClient({
    defaultOptions: {
        useErrorBoundary: true,
        queries: {
            suspense: true,
            useErrorBoundary: true,
            retry: 0,
        }
    }
});


const useUsers = () => {
    return useQuery("users", async () => {
        const users = await fetchUsers();
        console.log(users);
        return users;
    })
};

function UserList() {
    const { data, isFetching, error, status } = useUsers();
    const { users } = data;

   // return some render with users
}

我的 fetchUsers 方法：

export function fetchUsers(fields = ['id', 'name']) {
    console.info("fetch users");
    return request(`${process.env.REACT_APP_SERVER_URL}/graphql`, gql`
        query getUsers {
  users {
    ${fields},nice
  }
}`);
}

我的 App.js：

<QueryClientProvider client={queryClient}>
            <ErrorBoundary
                fallbackRender={({ error }) => (
                    <div>
                        There was an error!{" "}
                        <pre style={{ whiteSpace: "normal" }}>{error.message}</pre>
                    </div>
                )}
                onReset={() => {
                    // reset the state of your app so the error doesn't happen again
                }}
            >
                <UserList/>
            </ErrorBoundary>
        </QueryClientProvider>

当我输入不存在的 graphql 字段（又名 nice）时，我希望看到 ErrorBoundary 运行 - 但我的 react 应用程序崩溃：

Error: Cannot query field "nice" on type "User". Did you mean "name"?

为什么错误边界没有捕捉到这个错误？知道我错过了什么吗？

【问题讨论】：

标签： reactjs graphql graphql-js react-query react-error-boundary

【解决方案1】：

您是否设置了useErrorBoundary: true 以启用该选项，因为我在您的代码中没有看到该选项

【讨论】：

我好像错过了，应该在哪里设置？
作为一个选项使用Query（第三个参数是一个选项对象），或者全局放在QueryClient上
我现在设置了，同样的问题