Vueテンプレートはディレクティブと補間が追加されたHTMLです。HTMLのようなマークアップに、特殊な属性(v-で始まるディレクティブ)と動的な値のための{{ }}を加えて書きます。
テキスト補間(マスタッシュ)
vue
<template>
<h1>{{ title }}</h1> <!-- inserts the value of `title` -->
<p>{{ count * 2 }}</p> <!-- any JS expression works -->
<p>{{ isActive ? "On" : "Off" }}</p> <!-- ternaries, method calls, etc. -->
</template>
はJavaScriptの(ステートメントではなく)を評価し、結果をテキストとしてレンダリングします。データが変わると自動的に更新されます。
