# 全局組件
這些組件是**全局注冊的**。也就是說它們在注冊之后可以用在任何新創建的 Vue 根實例 (`new Vue`) 的模板中。
## 代碼
```html
<div id="app">
<my-article></my-article>
</div>
<script src="js/vue.js"></script>
<script>
Vue.component('my-article',{
template:`<div>
<h3>這是標題</h3>
<p>段落</p>
</div>`
})
var vm = new Vue({
el:"#app"
})
</script>
```
## 圖示
:-: 
## 注意事項：
>[danger] 必須先注冊才能使用。而且注冊要寫在實例之前。否則也不能生效。
> 組件名稱不可以使用瀏覽器支持的標簽。如：div,article……
## 組件名稱大小寫（掌握）
**使用 kebab-case(肉串/烤串)**
```
Vue.component('my-component-name', { /* ... */ })
```
使用組件
`<my-component-name>`。
**使用 PascalCase(大駝峰)**
```
Vue.component('MyComponentName', { /* ... */ })
```
使用組件`<my-component-name>` 和 `<MyComponentName>` 都是可接受的。
## 注意事項
>[danger] 盡管如此，直接在 DOM (即非字符串的模板) 中使用時只有 kebab-case 是有效的。
