组件（component）是vue.js的强大功能之一
组件系统让我们可以用独立可复用的小组件来构建大型应用，几乎任意类型的应用的界面都可以抽象为一个组件树：
图片来源于网络
1.组件的注册语法格式如下：
Vue.component('组件名tagname',配置选项)
2.注册了组件后就可以调用了
<tagname></tagname>
3.全局组件和局部组件
<div id="app">
<runoob></runoob>
</div>
<script>
// 注册 Vue.component('runoob', { template: '<h1>自定义组件!</h1>' })
// 创建根实例
new Vue({
el: '#app'
})
</script>
---------------这里是分割线-------------------------------
<div id="app">
<runoob></runoob>
</div>
<script>
var Child = { template: '<h1>自定义组件!</h1>' }
// 创建根实例
new Vue({ el: '#app', components: {
// <runoob> 将只在父模板可用 'runoob': Child
} })
</script>
4.关于对父组件和子组件的理解，不多比比，上代码
<zujian></zujian>
Vue.component('zujian',{
template:'<h></h>'
})
上面代码中，其实这个<zujian>就相当于下面<h3>的父级组件!是不是很惊讶，就是这么简单
再举个例子，传输数据
<zujian message="飞天"></zujian>
//我要把上面message的数据：飞天，用到<h>里面去
Vue.component('zujian',{
props:['message']//子组件要用父组件的数据必须要用props声明
template:'<h>{{message}}</h>'
})
结果：输出字符串：飞天
注意：
//子组件要用父组件的数据必须要用props声明
//子组件要用父组件的数据必须要用props声明
//子组件要用父组件的数据必须要用props声明