Want to take a look at our new docs? Our new docs are now in beta. Have fun!

Async data in components?

Because components do not have an asyncData method, you cannot directly fetch async data server side within a component. In order to get around this limitation you have two basic options:

  1. Make the API call in the mounted hook and set data properties when loaded. Downside: Won't work for server side rendering.
  2. Make the API call in the asyncData or fetch methods of the page component and pass the data as props to the sub components. Server rendering will work fine. Downside: the asyncData or fetch of the page might be less readable because it's loading the data for other components.


Contribution for this page is now closed. If you would like to contribute please check out our new docs are now in beta. Have fun!

Platinum Sponsors

StoryblokMoovweb Support Us