SolidJS•2y ago•

40 replies

createAsync vs createResource and how does Suspense work?

Hello. From doing some searches in here it looks like

createAsync

createAsync

cache

cache

) seems to be the new recommended approach for data loading.

I am wondering though,

createResource

createResource

returns a lot of information and options for the request

type ResourceReturn<T> = [
  {
    (): T | undefined
    state: "unresolved" | "pending" | "ready" | "refreshing" | "errored"
    loading: boolean
    error: any
    latest: T | undefined
  },
  {
    mutate: (v: T | undefined) => T | undefined
    refetch: (info: unknown) => Promise<T> | T
  }
]

type ResourceReturn<T> = [
  {
    (): T | undefined
    state: "unresolved" | "pending" | "ready" | "refreshing" | "errored"
    loading: boolean
    error: any
    latest: T | undefined
  },
  {
    mutate: (v: T | undefined) => T | undefined
    refetch: (info: unknown) => Promise<T> | T
  }
]

There is the state, the error, and options to mutate and refetch.

But

createAsync

createAsync

returns just the data.

What if I want to also get the state? What if I want to mutate/refetch the data?
And how should (or how can) I handle errors when using

createAsync

createAsync

?

EDIT: (Answering some of my own questions) since

createAsync

createAsync

returns the

data

data

from

createResource

createResource

then it is possible to use

data.loading

data.loading

and

data.error

data.error

If I use

createResource

createResource

instead then I won't be able to use

cache

cache

.

Also, I am wondering how Suspense actually works. How does it detect that some data is still loading. Is it possible to create my own resource manually that Suspense detects without using

createResource

createResource

createAsync vs createResource and how does Suspense work?

Hello. From doing some searches in here it looks like

createAsync

createAsync

cache

cache

) seems to be the new recommended approach for data loading.

I am wondering though,

createResource

createResource

returns a lot of information and options for the request

type ResourceReturn<T> = [
  {
    (): T | undefined
    state: "unresolved" | "pending" | "ready" | "refreshing" | "errored"
    loading: boolean
    error: any
    latest: T | undefined
  },
  {
    mutate: (v: T | undefined) => T | undefined
    refetch: (info: unknown) => Promise<T> | T
  }
]

type ResourceReturn<T> = [
  {
    (): T | undefined
    state: "unresolved" | "pending" | "ready" | "refreshing" | "errored"
    loading: boolean
    error: any
    latest: T | undefined
  },
  {
    mutate: (v: T | undefined) => T | undefined
    refetch: (info: unknown) => Promise<T> | T
  }
]

There is the state, the error, and options to mutate and refetch.

But

createAsync

createAsync

returns just the data.

What if I want to also get the state? What if I want to mutate/refetch the data?
And how should (or how can) I handle errors when using

createAsync

createAsync

?

EDIT: (Answering some of my own questions) since

createAsync

createAsync

returns the

data

data

from

createResource

createResource

then it is possible to use

data.loading

data.loading

and

data.error

data.error

If I use

createResource

createResource

instead then I won't be able to use

cache

cache

.

Also, I am wondering how Suspense actually works. How does it detect that some data is still loading. Is it possible to create my own resource manually that Suspense detects without using

createResource

createResource

createAsync vs createResource and how does Suspense work?

Similar Threads

createAsync vs createResource and how does Suspense work?

Similar Threads

Similar Threads

Similar Threads