[TOC]
## 1.使用組件
```
//html
<div id="app">
<todo-item :content="item" ></todo-item>
</div>
```
> :content="item"向子組件傳遞內容
使用駝峰命名方法就可直接使用xx-xx樣式的標簽
## 2.引入組件及注冊組件
### 2.1.引入
```
//js
import TodoItem from "../components//TodoItem";//引入
```
### 2.2.注冊
```
export default {
components: {
//注冊
MovieItem
},
}
```
## 3.定義組件
```
//組件模板
<template id="content">
<div>{{content}}</div>
</template>
```
```
//js
<script>
export default {
//起名
name: "todo-item",
//設置屬性向父組件傳參
props: {
content: {
type: String
}
},
methods:{
//組件模板的方法
}
};
</script>
```