How to change the default options for useQuery in react- query ?

在React Query中，useQuery 钩子允许您在应用程序中获取、缓存和更新来自异步来源的数据。如果您想修改useQuery的默认配置项，有几种方式可以做到这一点：

1. 在单个useQuery调用中直接修改：

   您可以直接在调用useQuery时传递配置对象来覆盖默认设置。例如：

   jsx
   const { data, error, isLoading } = useQuery('todos', fetchTodos, {
     // 覆盖默认配置
     refetchOnWindowFocus: false,
     staleTime: 5000, // 5秒
     cacheTime: 1000 * 60 * 60 * 24, // 24小时
     // 其他配置...
   });

   在上述例子中，refetchOnWindowFocus 被设置为false以阻止窗口聚焦时的自动数据重新获取，staleTime 被设置为5秒，这意味着数据在5秒内被认为是新鲜的，而cacheTime 被设置为24小时，指定了缓存数据的时间长度。

2. 使用QueryClient设置全局默认配置：

   如果您想对整个应用程序的所有useQuery调用设置默认配置，您可以在创建QueryClient实例时传递一个配置对象。例如：

   jsx
   import { QueryClient, QueryClientProvider } from 'react-query';
   
   // 创建一个自定义的默认配置
   const queryClient = new QueryClient({
     defaultOptions: {
       queries: {
         // 这里设定的是全局默认配置
         refetchOnWindowFocus: false,
         staleTime: 5000,
         cacheTime: 1000 * 60 * 60 * 24,
         // 其他全局配置...
       },
     },
   });
   
   // 在应用程序中使用QueryClientProvider包裹您的组件
   function App() {
     return (
       <QueryClientProvider client={queryClient}>
         {/* 应用程序的其他部分 */}
       </QueryClientProvider>
     );
   }

   通过这种方式，您为整个应用设置了全局的默认配置，这些配置会应用到所有的useQuery调用中，除非在具体的useQuery调用中覆盖。

3. 使用useQuery的默认配置：

   如果您想更改某些配置项的默认值，但不想影响全局设置或创建新的QueryClient实例，您可以使用React Query提供的QueryClient的setDefaultOptions方法：

   jsx
   // 首先获取现有的QueryClient实例
   const queryClient = useQueryClient();
   
   // 然后设置默认配置
   queryClient.setDefaultOptions({
     queries: {
       refetchOnWindowFocus: false,
       staleTime: 5000,
       // 更多默认配置...
     },
   });

使用以上方法之一，您就可以根据需要修改useQuery的默认配置项。记住，对于每一个具体的useQuery调用，直接传递的配置项总是优先级最高的。