0 day streak
javascript / beginner
Snippet

Multiple Root Elements (Fragments)

In Vue 3, components no longer require a single wrapper element. You can have multiple top-level elements, which keeps the HTML structure cleaner.

snippet.js
javascript
1
2
3
4
5
<template>
<header>Navigation</header>
<main>Content</main>
<footer>Footer</footer>
</template>
vue
Breakdown
1
<template>
The container for the component's HTML structure.
2
<header>...</header>
First root element.
3
<main>...</main>
Second root element acting as a sibling.