slots 宣言的なスロットアクセス（3.3+）
最終更新：2026-10-22
slots 宣言的なスロットアクセス（3.3+）
slots オプションは、スロットへのアクセスを関数形式で宣言し、トラッキング可能な $slots を生成します。「スロットが渡されているか」もリアクティブに判定できます。
| グループ | オプション: 描画とライフサイクル |
|---|---|
| 種類 | オプション |
| スコープ | コンポーネント内 |
| Vue バージョン | 3.0+ |
| SSR 対応 | 対応 |
📝 構文
export default {
slots: { default: () => [], header: () => [] }
}⚙️ 引数
| value | オブジェクト：キーはスロット名、値はそのスロットの内容を返す関数 |
|---|
戻り値：戻り値なし（$slots を生成します）
▶ 例
以下のコードを編集して結果を確認しましょう：
出力：
Shows the parent's header content.💡 ポイント
ℹ️ 補足 3.3 で追加されました。スロットの有無の判定が古くなる問題を解決します。
💡 ヒント コンポーネントライブラリでスロットの存在判定を行う場合は、この宣言的な書き方が推奨されます。
⚠️ 注意 すべてのスロットを列挙してください。書き漏れがあるとそのスロットにアクセスできません。
🏷️ 関連描画とライフサイクル
💡 関連ケース
関連ケースは近日公開予定。
📚 関連チュートリアル
❓ よくある質問
Q $slots との違いは？
A 同じデータですが、依存トラッキングが効くようになります。
Q すべてのスロットを列挙する必要がありますか？
A はい。未宣言のスロットは存在しないものとして扱われます。
Q <script setup> の useSlots との関係は？
A useSlots() のオプション形式の対応物です。
