# 組件名 ## 語法： ## kebab-case 短橫線 推薦 ## my-div ## html不區分大小寫，標簽統一轉成小寫 推薦使用短橫線kebab-case ## 一個組件的data 選項必須是一個函數，因此每個實例可以維護一份被返回對象的獨立的拷貝 ``` Vue.component('my-button',{ template:'<button @click="count++">點我加{{count}}</button>>', data:function (){ return { count:0 } } ``` # 多標簽組鍵 ## 用``符號 ~~~ var articles={ //創建一個組鍵 其中articles是自定義名稱與變量一樣 template:` <ul> <li v-for='article in articles'> //歷遍數據 <h1>{{ article.title }}</h1> <img :src='article.src' alt=""> //圖片輸出方法 <p>{{ article.desc }}</p> </li> </ul> ` } ~~~