Fetch Details
Every hook that leverages
react-query
behind the scenes returns an object which contains the requested information, as well as information on the request itself. This looks like:{
fetchDetails: FetchDetailsType,
[dataIdentifier: string]: Data
}
fetchDetails
encompasses the following information, fields, and functionality:
status: String
- Will be:
loading
if there's no cached data and no query attempt was finished yet.error
if the query attempt resulted in an error. The correspondingerror
property has the error received from the attempted fetchsuccess
if the query has received a response with no errors and is ready to display its data. The correspondingdata
property on the query is the data received from the successful fetch or if the query'senabled
property is set tofalse
and has not been fetched yetdata
is the firstinitialData
supplied to the query on initialization.
isLoading: boolean
- A derived boolean from the
status
variable above, provided for convenience.
isSuccess: boolean
- A derived boolean from the
status
variable above, provided for convenience.
isError: boolean
- A derived boolean from the
status
variable above, provided for convenience.
isLoadingError: boolean
- Will be
true
if the query failed while fetching for the first time.
isRefetchError: boolean
- Will be
true
if the query failed while refetching.
dataUpdatedAt: number
- The timestamp for when the query most recently returned the
status
as"success"
.
error: null | TError
- Defaults to
null
- The error object for the query, if an error was thrown.
errorUpdatedAt: number
- The timestamp for when the query most recently returned the
status
as"error"
.
isStale: boolean
- Will be
true
if the data in the cache is invalidated or if the data is older than the givenstaleTime
.
isPlaceholderData: boolean
- Will be
true
if the data shown is the placeholder data.
isPreviousData: boolean
- Will be
true
whenkeepPreviousData
is set and data from the previous query is returned.
isFetched: boolean
- Will be
true
if the query has been fetched.
isFetchedAfterMount: boolean
- Will be
true
if the query has been fetched after the component mounted. - This property can be used to not show any previously cached data.
fetchStatus: FetchStatus
fetching
: Istrue
whenever the queryFn is executing, which includes initialloading
as well as background refetches.paused
: The query wanted to fetch, but has beenpaused
.idle
: The query is not fetching.
isFetching: boolean
- A derived boolean from the
fetchStatus
variable above, provided for convenience.
isPaused: boolean
- A derived boolean from the
fetchStatus
variable above, provided for convenience.
isRefetching: boolean
- Is
true
whenever a background refetch is in-flight, which does not include initialloading
- Is the same as
isFetching && !isLoading
isInitialLoading: boolean
- Is
true
whenever the first fetch for a query is in-flight - Is the same as
isFetching && isLoading
failureCount: number
- The failure count for the query.
- Incremented every time the query fails.
- Reset to
0
when the query succeeds.
errorUpdateCount: number
- The sum of all errors.
refetch: (options: { throwOnError: boolean, cancelRefetch: boolean }) => Promise<UseQueryResult>
- A function to manually refetch the query.
- If the query errors, the error will only be logged. If you want an error to be thrown, pass the
throwOnError: true
option cancelRefetch?: boolean
- Defaults to
true
- Per default, a currently running request will be cancelled before a new request is made
- When set to
false
, no refetch will be made if there is already a request running.
remove: () => void
- A function to remove the query from the cache.
Last modified 3mo ago