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
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.