什么是组件？
组件（Component）是 Vue.js 最强大的功能之一。组件可以扩展 HTML 元素，封装可重用的代码。在较高层面上，组件是自定义元素，Vue.js 的编译器为它添加特殊功能。在有些情况下，组件也可以是原生 HTML 元素的形式，以 is 特性扩展。
本篇资料是小编参考官方文档的基础上整理的一篇更加细致的说明，代码更多更全，非常适合新手学习。
官方文档：
组件——杂项详细介绍如下所示：
①组件和v-for
简单来说，就是组件被多次复用；
例如表格里的某一行，又例如电商的商品橱窗展示（单个橱窗），都可以成为可以被复用的组件；
只要编写其中一个作为组件，然后使数据来源成为一个数组（或对象，但个人觉得最好是数组），通过v-for的遍历，组件的每个实例，都可以获取这个数组中的一项，从而生成全部的组件。
而数据传输，由于复用，所以需要使用props，将遍历结果i，和props绑定的数据绑定起来，绑定方法同普通的形式，在模板中绑定。
示例代码：
说明：
【1】记得将要传递的数据放在props里！
【2】将index和索引$index绑定起来，因为索引从0开始，因此索引所在列是从0开始；id是和遍历items的i绑定在一起的，因此id从1开始。
【3】可以在父组件中，通过this.$children来获取子组件（但是比较麻烦，特别是组件多的时候，比较难定位）；
②编写可复用的组件：
简单来说，一次性组件（只用在这里，不会被复用的）跟其他组件紧密耦合是可以的，但是，可复用的组件应当定义一个清晰的公开接口。（不然别人怎么用？）
可复用的组件，基本都是要和外部交互的，而一个组件和外部公开的交互接口有：
【1】props：允许外部环境数据传递给组件；
【2】事件：允许组件触发外部环境的action，就是说通过在挂载点添加v-on指令，让子组件的events触发时，同时触发父组件的methods；
【3】slot：分发，允许将父组件的内容插入到子组件的视图结构中。
如代码：