Несколько элементов и комментарии

Посмотрите на шаблоны, которые вы писали до сих пор: заголовок, абзацы и кнопки рядом, без общего элемента вокруг. Так можно: в шаблоне может быть несколько элементов верхнего уровня, и Vue поместит их все в #app. (В Vue 2, старой версии, в шаблоне нужен был ровно один элемент верхнего уровня, поэтому в старом коде всё часто оборачивают в <div>.)

Комментарии в шаблоне пишутся как в HTML, между <!-- и -->. Браузер их не показывает:

<template>
    <!-- Цены меняются каждый сезон. -->
    <p>Чизкейк, €{{ price }}</p>
</template>

В каждой части файла .vue комментарии записываются по правилам её языка: в <script setup> это // JavaScript до конца строки и /* */ на несколько строк, а в <style> — /* */ из CSS.

Комментарии объясняют то, что не понятно из самого кода. Ими можно и ненадолго выключить часть шаблона: элемент внутри комментария не попадает на страницу, но остаётся в коде и готов вернуться. Программисты называют это закомментировать.

Типичные ошибки:

• // из JavaScript в шаблоне не работает. Там это обычный текст, и страница его показывает.