Vue实践--初识组件

组件是Vue.js的核心，因为组件可以复用，能够做到一套代码，在任何地方都可以用，所以维护的成本大大缩小。

Vue的组件在复用的时候是相互独立的；

Vue组件的使用：先注册（局部注册/全局注册）,后使用,而且要在实例创建前注册（new之前）；

注册也分为全局注册和局部注册，下面来说一下两者的区别...

全局注册：

在全局的vue环境中均可以使用（相当于全局变量一样），注册方法：使用Vue.component("组件名",{//options})类似于这样的写法进行全局注册，在这里要注意的是：

组件名：推荐使用小写加"-"分割的形式，例如：

Vue.component("my-component",{
			template:"<div>这是一次非常美好的邂逅</div>" 
		})

局部组件注册：

在实例的components选项中定义和注册（值是一个对象，包含templete，porps等很多选项），只有在该实例所挂载的元素内部使用。例如：

var myApp = new Vue({
			el:"#container",
			data:{
				datas:"前端之旅"
			},
			components:{
				"jb-component":{
					template:"<span>局部注册的组件</span>"
				}
			}
		})

现阶段个人理解：

组件就像Vue实例一样，除了拥有template选项外，还有data，methods，computed选项等等；作用也和实例中对应的选项的差不多（组件可以直接访问，或者在某种程度上，可以将组件视作小实例），只不过组件中的data选项必须是一个函数，然后将数据return出去。