Vue的指令，生命周期，组件通讯

vue的生命周期
要了解vue，就必须清楚知道vue的生命周期，好比一个人从生到死是怎么回事得知道，也更有利于coder实现对应业务功能。
类似于window.onload，vue提供了很多的生命周期函数（钩子函数），完整的将整个Vue对象从创建到销毁进行了细致的划分。
Beforecreat（创建之前）
Created （创建完成）
Beforemount （渲染之前）
Mounted（渲染之后）
Beforeupdata（数据修改前）
Updated（数据修改后）
Beforedestroy（对象销毁前）
Destroyed（对象销毁后）
这八个函数清晰的表述了Vue对象的生命周期，常用的created,mounted之类的函数也是在开发过程中会频繁使用到的。

vue的组件通讯
ps:学到这要具备相对扎实的JS功底，不然这里有可能会搞晕
关于组件通讯分两种，父子组件传值与非父子组件传值，分门别类说一下：
父子组件中又分父调子和子调父两种，很多人这里会晕一下，个人建议，用作用域的方式来区别：
子调父的方法最简单，只需在子组件内用props:[“attr1”,“attr2”],这样的方式，将需要调用的父组件数据写入即可直接在子组件内使用父组件的数据。
父调子相对麻烦一点，不过也并不繁琐：

1.调用方法触发后，调用$emit方法，其中的参数第一个写入的事自定义的函数，后面的是需要调用的子组件的值；

2.在父组件模板中的子组件标签内直接调用该自定义函数，e-word为自定义方法，getData则是为了接到传递的数据

<template id="t1">
	<h2>
		我是父亲组件，{{attr1}}
		<div>{{attr2}}</div>
		<erzi :attr1="attr1" :attr3="attr3" @e-word="getData"></erzi>
	</h2>
</template>

methods:{
	getData(attr2){
		this.attr2 = attr2
	}
},

至此，父组件已经可以使用子组件内的attr2的数据了
3.非父子组件调用
①需要提前创建一个新的vue对象，
②调用方法开始后执行新的vue对象的方法$emit(),这里类似于父调子时的写法，
③在主动调用的组件内，根据生命周期函数mounted后，执行新的vue对象的.on方法来获取第二步传递的参数
（event是新创建的vue对象，.on为接收数据，e-word是第二步自定义的方法）

event.$on("e-word",attr2=>{
	this.attr2 = attr2
})

至此非父子组件的传值也已完成。
今天暂时码这点，后续再更新。