Scaling UpLesson 27Free preview

Vue Slots

This lesson is part of Vue · All levels

Summary

The slot provides a way for the parent component to insert its own content into the child component, making the child a flexible container. The built-in slot hosts all unnamed content, while the named slot allows content to be grouped into multiple locations. Children can also provide in-built content that appears if the parent does not fill the slot.

Key points

The slot allows the parent to send HTML content to the child.
The slot elements mark the location of the content entry.
Unnamed content enters the default slot.
The built-in slot displays a fallback when the host does not send content.
The slot makes the component more reusable as a wrapper.

Full lesson

Code examples and quizzes

Full lessons, code examples, and quizzes are available to subscribers. 5 questions.