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:

• Make the API call in the mounted hook and set data properties when loaded. Downside: Won't work for server side rendering.
• 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.