Clear out Error upon re-fetch?

[christianflorez]

Hi all I have some code that looks like the following:

function useApi(
  service
  query,
  variables
) {
  const { data, error } = useSWR([service, query, variables], fetch, {
    shouldRetryOnError: false,
  })

  const isLoading = !data && !error

  return { isLoading, error, data }
}

My fetch is a simple function that uses axios under the hood to fetch data. Currently, whenever an error happens in the fetch function, useSWR returns that error and then gets exposed at the end of the useApi function. However, if a new request to that same endpoint gets created, that error persists until the fetch call terminates successfully, which clears out the error, or the fetch call fails, in which case the error is updated.

Is there a way to "clear out" the error every time the fetch function calls the same endpoint? That way, an error is potentially pending while the request is in flight, rather than having the error persist until a fetch finalizes and determines a new error state.

[jclem]

So far I've been using SWRConfig to clear out the entire cache on errors to prevent this:

// import {cache} from 'swr'

<SWRConfig value={{
  onError: () => cache.clear()
}}></SWRConfig>

This doesn't seem like a great solution, but I think it's working for now. I tried deleting just the cache key for the error, but the error still appears to be cached, anyway, in that case.

[fcrezza]

Very late to the party and yes swr will automatically clear an error in specific endpoint if the result of that endpoint was successful but in case you want to fetch data again after the error occurs in the first fetch, you can clear an error in a specific endpoint by just calling mutate and pass null value like this

mutate('/endpoint', null, true)

the code above will automatically clear the error related to the endpoint and swr will revalidate the endpoint, this is not the case if we pass an undefined value, the error still persist

// import useSWR from 'swr'
const {data, error, mutate} = useSWR('/api_endpoint', fetcher)
mutate(undefined, true)
console.log(error) // error still persist
``

[shuding]

You can do this to manually clear the error state as well, without starting a new revalidation:

const { data, error, mutate } = useSWR('/api_endpoint', fetcher)
mutate(v => v, false)

[bozdoz]

@shuding's approach is likely preferred, since it won't wipe existing data (v => v)

[avispeng]

You can do this to manually clear the error state as well, without starting a new revalidation:

const { data, error, mutate } = useSWR('/api_endpoint', fetcher)
mutate(v => v, false)

This seems to stop working now. Without revalidating, error will not be cleared.

[arnarleifs]

None of these suggestions work using 'swr': '2.2.4'