useAsyncData/useFetch > Function > Pinia Action - Best practices?

Hey folks, looking for some advice. I currently have something like this

const { error } = useAsyncData('details', async () => {
  if (isSelected.value) return details.value

  await fetchdetails()

  return details.value
})

const { error } = useAsyncData('details', async () => {
  if (isSelected.value) return details.value

  await fetchdetails()

  return details.value
})

so I already think im using it weird, but then that

fetchDetails

fetchDetails

is in the component, and it has some logic on building a payload, which ultimately then fires off a pinia action, and then our pinia action, uses

useFetchApi

useFetchApi

(which is a composable of $fetch) - so were now at like 4 levels of execution lol, it just feels a bit icky.

Im just wondering what the best practices here might be, like the useAsyncData at the top, would that be advised/not advised given the scenario ive explained?

Nuxt•16mo ago•

6 replies

useAsyncData/useFetch > Function > Pinia Action - Best practices?

Hey folks, looking for some advice. I currently have something like this

const { error } = useAsyncData('details', async () => {
  if (isSelected.value) return details.value

  await fetchdetails()

  return details.value
})

const { error } = useAsyncData('details', async () => {
  if (isSelected.value) return details.value

  await fetchdetails()

  return details.value
})

so I already think im using it weird, but then that

fetchDetails

fetchDetails

is in the component, and it has some logic on building a payload, which ultimately then fires off a pinia action, and then our pinia action, uses

useFetchApi

useFetchApi

useAsyncData/useFetch > Function > Pinia Action - Best practices?

Similar Threads

useAsyncData/useFetch > Function > Pinia Action - Best practices?

Similar Threads

Similar Threads

Similar Threads