Can you destructure a result from an SWR query?

Question

I have a very simple query to an external API:

 const fetcher = (...args) => fetch(...args).then(x=>x.json())
 const {data:{results}, error} = useSWR("https://xxxxxxxxxxxxxxxx",fetcher)

Whenever I use it like this to destructure the data variable, I get an error saying that "results" is not defined. I can only access results as "data.results", is this a normal behavior?

Answer 1

If data isn't resolved, then at build time you can't deconstruct like that. If you happen to use typescript, maybe it'll be more clear. Since I bet data has to have type whateverType | null. THe null prevents the deconstruction at the compile time.

In short, just use data. And then if (data.results) {} at the runtime then.