---
# System prepended metadata

title: Template Syntax
tags: [Vue]

---

# Template Syntax
> 在 HTML 標籤上寫上模板語法，樣板定義的數值會從 JS 的實體化物件中取得（this）。

###### tags: `Vue`
```javascript=
// 範例程式碼
var vm = new Vue({
  el: "#app",
  data: {
    a: 1
  },
  created() {
    setInterval(() => {
      this.a++;
    }, 1000);
  }
});
```
### Mustache 標籤 `{{}}`
> 雙刮號内可以是"變數"或"陳述式"。
```htmlembedded=
<div id="app">
  {{a}}  // a 每一秒會更新一次數字
</div>
```
### Directive V-指令
> Vue 特有的 HTML 屬性（指令），以 `-v` 前綴字開頭，與一般 HTML 屬性區分。

#### v-once
> 綁定一次性數值。
```htmlembedded=
<div id="app" v-once>
  {{a}}  // a 會一直是 1
</div>
```
#### v-bind
#### v-for
#### v-show
#### v-model


```htmlembedded=
<!-- 123 -->
```