<NuxtIsland>
Nuxtは、クライアントJSなしで非インタラクティブなコンポーネントをレンダリングするために、<NuxtIsland>コンポーネントを提供します。
アイランドコンポーネントをレンダリングする場合、アイランドコンポーネントの内容は静的であるため、クライアント側でJSはダウンロードされません。
アイランドコンポーネントのpropsを変更すると、アイランドコンポーネントの再フェッチがトリガーされ、再度レンダリングされます。
アプリケーションのグローバルスタイルは、レスポンスとともに送信されます。
サーバーのみのコンポーネントは、内部で
<NuxtIsland>を使用します。Props
name: レンダリングするコンポーネントの名前。- type:
string - 必須
- type:
lazy: コンポーネントをノンブロッキングにします。- type:
boolean - default:
false
- type:
props: レンダリングするコンポーネントに送信するprops。- type:
Record<string, any>
- type:
source: アイランドをレンダリングするために呼び出すリモートソース。- type:
string
- type:
- dangerouslyLoadClientComponents: リモートソースからコンポーネントをロードするために必要です。
- type:
boolean - default:
false
- type:
リモートアイランドには、
nuxt.configでexperimental.componentIslandsが'local+remote'である必要があります。リモートサーバーのjavascriptを信頼できないため、dangerouslyLoadClientComponentsを有効にすることは強く推奨されません。スロット
スロットは、宣言されていれば、アイランドコンポーネントに渡すことができます。
すべてのスロットは、親コンポーネントが提供するため、インタラクティブです。
一部のスロットは、特別なケースのためにNuxtIsland用に予約されています。
#fallback: コンポーネントが読み込まれる前（コンポーネントがlazyの場合）またはNuxtIslandがコンポーネントのフェッチに失敗した場合にレンダリングされるコンテンツを指定します。
Ref
refresh()- type:
() => Promise<void> - description: 再フェッチすることにより、サーバーコンポーネントを強制的に再フェッチします。
- type:
イベント
error- パラメーター:
- error:
- type:
unknown
- type:
- error:
- description:
NuxtIslandが新しいアイランドのフェッチに失敗した場合に発生します。
- パラメーター: