# と v-slot: は同じですか？

完全に等価です。# は公式の省略記法で、v-slot に引数を付けない場合はデフォルトスロットを表します。

スコープ付きスロットとは何ですか？

子コンポーネントが slot タグ経由でデータを親のコンテンツフラグメントに渡す仕組みです（例：#default="{ item }"）。リストコンポーネントのカスタマイズの核心です。

置けません。<template> またはコンポーネントタグにのみ使えます。これが最もよくあるエラーの原因です。

最終更新：2026-10-22

v-slot はスロットの内容を指定します。省略記法は # です。テンプレートの断片を子コンポーネントの名前付きスロットやスコープ付きスロットに渡します。

<template v-slot:header>...</template>
<template #default="{ item }">...</template>
<Child v-slot="{ data }">

expression	スロット名（省略時はデフォルトスロット）。スコープ付きスロットでは子コンポーネントから渡されたデータを分割代入できます

戻り値：ディレクティブ。戻り値なし

以下のコードを編集して結果を確認しましょう：

出力：

The page shows a bold 'Custom header' — parent content replaced the slot default.

💡 ヒント # は v-slot: の省略記法で、#header は v-slot:header と等価です。

⚠️ 注意 v-slot は