Scaling UpLesson 28Free preview
Vue v-slot
This lesson is part of Vue · All levels
Summary
The v-slot directive tells Vue where the parent content should be entered when there are multiple named slots. The full v-slot syntax is followed by the name slot, with the more commonly used hash abbreviation #namaSlot. There can only be one built-in slot, whereas named slots can be numbered according to the component's needs.
Key points
- V-slot places content in a slot named, for example v-slot:header.
- The v-slot abbreviation is #, for example #header.
- There's only one slot, but there's plenty of named slots.
- The v-slot can only be used on component tags or templates, not on ordinary elements.
- This directive is a container of the slot name pairs with the content.
Full lesson
Code examples and quizzes
Full lessons, code examples, and quizzes are available to subscribers. 5 questions.