首页 > 代码库 > vue个人学习(四)----生命周期

vue个人学习(四)----生命周期

 

生命周期:

beforeCreate          组件实例刚刚被创建,属性都没有
created                  实例已经创建完成,属性已经绑定
beforeMount          模板编译之前
mounted               模板编译之后,代替之前ready *
beforeUpdate        组件更新之前
updated               组件更新完毕 *
beforeDestroy      组件销毁前
destroyed            组件销毁后

 

书写方法:

				new Vue({
					el: "#box",
					data:{
						msg:‘hello!‘
					},
					beforeCreate(){
						console.log("组件实例刚刚被创建");
					},
					created(){
						console.log("实例已经创建完成");
					},
					beforeMount(){
						console.log("模板编译之前");
					},
					mounted(){
						console.log("模板编译完成");
					}
				});

  

生命周期图示

下图说明了实例的生命周期。你不需要立马弄明白所有的东西,不过以后它会有帮助。

技术分享

vue个人学习(四)----生命周期