// Refined `fetch` APIuseQuery(['todos',todoId],async()=>{constresponse=awaitfetch('/todos/'+todoId);// Throw error if status code is not 2xxif(!response.ok){thrownewError(response.statusText);}returnresponse.json();});// `axios` libraryuseQuery(['todos',todoId],()=>axios.get(...
enabled: 如果为“false”,“useQuery”不会触发,需要使用其返回的“refetch”来触发操作 queryFn:全局定义请求方法,其他地方使用时只需要直接传入请求参数 2.1.2 useQuery useQuery是React-Query提供的用于请求接口并管理请求状态等信息的Hook。 例如: function Example() { const { isLoading, error, data } = ...
const{data,//这个就是请求成功回来的数据isLoading,//true表示数据在获取的路上error,//错误对象,如果存在则包含相关的错误信息refetch,//这个还挺实用的,你可以在需要的地方或需要更新数据时调用,则会触发这个请求,比如enabled=false时...}=useQuery(queryKey,queryFn?,options?) 复制代码 Mutation(突变) 用来...
defaultOptions:请求基础配置 其中defaultOptions用于配置项目中useQuery请求的管理,常用的配置如下: staleTime: 重新获取数据的时间间隔 默认0 cacheTime: 数据缓存时间 默认 1000 60 5 5分钟 retry: 失败重试次数 默认 3次 refetchOnWindowFocus: 窗口重新获得焦点时重新获取数据 默认 false refetchOnReconnect: 网络...
如果用户离开您的应用时数据是标记为过时的,React Query 会自动在后台为您请求新的数据。 您可以使用refetchOnWindowFocus选项在全局或每个查询中禁用此选项。 全局禁用 const queryClient = new QueryClient({ defaultOptions: { queries: { refetchOnWindowFocus: false, }, }, }); function App() { ret...
defaultOptions:请求基础配置 其中defaultOptions用于配置项目中useQuery请求的管理,常用的配置如下: staleTime: 重新获取数据的时间间隔 默认0 cacheTime: 数据缓存时间 默认 1000 60 5 5分钟 retry: 失败重试次数 默认 3次 refetchOnWindowFocus: 窗口重新获得焦点时重新获取数据 默认 false ...
If specified, this function is used to hash thequeryKeyto a string. refetchInterval: number | false | ((data: TData | undefined, query: Query) => number | false) Optional If set to a number, all queries will continuously refetch at this frequency in milliseconds ...
</QueryMetaProvider> const headerMeta = { region: 'header' } You could refetch based on meta via the following call: queryClient.refetchQueries({ predicate: (query) => ((query as any).observers as QueryObserver[]).find((observer) => observer.options.meta?.region === 'header') }) ...
enabled,onError,onSuccess,refetchOnWindowFocus,retry,staleTime,}) 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. 如果我们把这些 API 简化如下: 复制 const {...result,}=useQuery(queryKey,queryFn?,{...options,}) ...
您需要做的只是设置enabled: false,query options然后在数据准备好时将其设置为 true。const RouterController = () => { const { data: updatedUser, isLoading, error: fetchError } = useQuery( "user", FetchCurrentUser, { ...