Option to disable cache

[verekia]

Hi, thank you for the hook! Loving it.

I am running into a blocker though, as I am trying to use useAxios but it seems like it's impossible to disable caching for normal (not refetched) calls.

My API endpoint doesn't always return the same thing, which is a very common situation.

In my particular case, when I log out, useAxios still returns all the same data as when the user was logged in as I navigate through the app instead of allowing me to show a "you are not logged in" message.

Having the useCache option on the normal hook call seems like it would be a simple fix (rather than implementing a full fetch policy).

To be honest, it seems like an absolutely necessary feature 😅.

[simoneb]

Hi, sorry for the delay. This requires more details. By disabling cache, what do you mean exactly?

At the current time the hook is executed whenever the configuration (url and other request options) change. It wouldn't make sense to re-execute the hook every time that the component renders. So I presume that what you're saying is, when the component is re-mounted, which would execute the hook, instead of using the cache, which is what happens by default, skip it and execute the request again. I'm not sure what kind of benefit this provides though, because usually you wouldn't use component (re)mounting to decide when to execute requests. Can you clarify your scenario?

[simoneb]

Meanwhile, I went ahead and added tests by building on top of your PR here: #37.

I'm still not sure exactly what value this provides though, I'd like to hear your thoughts based on the previous comment.

[verekia]

For a given URL and request options, APIs may not always return the same data. Data may evolve over time, and an application might require to always get the latest data. Unless I am mistaken it seems impossible to use the hook if for instance, we run it on a homepage that would call, let's say /get-latest-posts. When navigating back and forth between such homepage of the app and other pages, we would not get the most recent data on the home page but some cached data. Refetching would not be an elegant solution in such case, since we really want to make a new fresh call at each mount.

[verekia]

When I use Apollo Client, I prefer to disable the cache completely with a network-only fetch policy, because it is more valuable in my use case to be 100% sure we always get the latest data, than saving some requests.

[simoneb]

Thanks for confirming @verekia. Note that this is already possible by using the manual option and the execute function that is returned by the hook. For instance, in your component, you could easily do:

const [{ data }, execute] = useAxios(..., { manual: true })

useEffect(() => {
  execute()
}, [])

You would achieve the same as with this new option we're discussing. I appreciate it's additional code you have to write though.

[verekia]

Thank you. Well it's true that it would work, but for me one of the main added value of this kind of network hook is to not have to use useEffect, which just feels so heavy after having had the pleasure to write lightweight code with network hooks. Functional components code are getting quite big now with hooks, so even those extra 3 lines of code have a cost for the codebase maintenance. My 2 cents :)

[simoneb]

@verekia can you review #37 then please?

[simoneb]

released in version 1.4.0