Vue Slots

up:: Vue Components Using components as wrappers.

<template>
	<slot></slot>
</template>

• v-slot
• Vue Scoped Slots

Default content

You can specify fallback content within the slot tags.

<template>
	<slot>
		<p>Default content</p>
	</slot>
</template>

$slots

There is a built-in method to inspect slots. We can check if we receive info for a specific slot.

this.$slots.header

<header v-if='$slots.header'>
	… slot in here
</header>