在元件模板中通常是以「標籤」的形式來做使用，所以在命名上就會有些限制，也是因為必扁與其他標籤名稱產生衝突，在打多數人的認知通常會以兩個以上的單字來命名，如<tode-item>、<component-layout>等等。

通常我們有兩種命名方式

• 自首大寫駝峰式命名 (pascal-case)
  "TodeItem" 、 "ComponentLayout" 、 "BaseTable" ...
• 連字號(kebab-case)的方式來命名。
  "tode-item" 、 "component-layout" 、 "base-table" ...

由於在解析HTML標籤時，並沒有大小寫的差別，所以在命名時就會使用連字號標籤。可以從昨天的例子可以看到我們在HTML裡為什麼使用<my-component>來命名，但是在.vue單一元件的<template>模板中就沒有那麼多限制了。

那什麼是單一元件呢?

在剛剛我們有提到.vue的命名，那.vue是什麼，.vue跟元件很像，指示是以.vue檔案的方式包裝起來，酨透過import的方式引入檔案做子元件使用，所以通常我們稱這樣為Vue的單一元件檔(Single File Components,SFC)。

在一個SFC通常會包含三種東西，第一為HTML模板的<template>、用來定義元件結構與邏輯的<script>與CSS格式的<style>。

今天就先到這了，明天見~