Specifikace syntaxe SFC
Přehled
Vue Single-File komponenta (SFC), dle konvence označována příponou *.vue
, je proprietární formát souboru, který používá syntaxi podobnou HTML k popisu Vue komponent. Vue SFC je syntakticky kompatibilní s HTML.
Každý soubor *.vue
se skládá ze tří typů bloků nejvyšší úrovně: <template>
, <script>
a <style>
, a volitelně dalších vlastních bloků:
vue
<template>
<div class="example">{{ msg }}</div>
</template>
<script>
export default {
data() {
return {
msg: 'Ahoj, Vue!'
}
}
}
</script>
<style>
.example {
color: red;
}
</style>
<custom1>
Toto může být například dokumentace komponenty.
</custom1>
Jazykové bloky
<template>
Každý soubor
*.vue
může obsahovat maximálně jeden blok<template>
nejvyšší úrovně.Obsah bude extrahován a předán do
@vue/compiler-dom
, předkompilován do JavaScriptových funkcí pro vykreslování a připojen k exportované komponentě jako její možnost (option)render
.