[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>
```
