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

コンポーネント内で非同期データを扱うには?

コンポーネントは asyncData メソッドを持たないため、サーバーサイドでコンポーネント内で非同期にデータを取得することは直接的にはできません。ただし、そのような制限を回避する方法が 2 つあります:

  1. mounted() フック内に API コールを作成し、ロード時に data プロパティをセットすること。マイナスな側面: サーバーサイドレンダリングでは機能しません。
  2. ページコンポーネントの asyncData() または fetch() メソッド内に API コールを作成し、データを props としてサブコンポーネントへ渡すこと。この方法ではサーバーサイドレンダリングでもうまく機能します。マイナスな側面: ページ内 asyncData() または fetch() が他のコンポーネントのデータをロードするため、可読性が落ちるかもしれません。
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