Vue生命周期函数(钩子函数)

 //vm实例创建中
				//1.data都还没有构建出来数据
				//2.方法也还没有构建出来
				beforeCreate() {
					console.log("vm实例创建中")
					// console.log(this.msg)//这时候data都还没有构建出来数据
					// this.fn()
				},

				//vm实例创建完毕
				//data 方法 等等工具已经构建完毕
				//但是vm还没有挂载到界面上去,可以在这个钩子中做页面第一次加载时的网络请求
				created() {
					console.log("vm实例创建完毕")
					// console.log(this.msg)
					// this.fn()
				},

				//挂载到DOM之前
				//data等vm对象的工具构建完毕 正在挂载到DOM中
				beforeMount() {
					console.log("挂载到DOM之前")
				},

				//挂载到DOM上了
				//有点像window.onload
				//这里也可以做网络请求,页面加载了之后的所有业务,都可以在这里
				//这个函数执行标志着 vm和dom成功关联==>随意操作vm来间接的操作dom
				mounted() {
					console.log("挂载到DOM上了")
				},

				//更新数据之前
				beforeUpdate() {
					alert("更新数据之前")
                  debugger//卡住页面
				},

				//更新数据完毕
				//data.xx=100
				//xxx.innerHTML=data.xx
				//更新的是data,这时候还没有刷新UI,它会找一个合适的时机去刷新UI
				//这个钩子调用之后才会刷新UI
				updated() {
					alert("更新数据完毕")
				},
				

				//销毁实例之前
				//常常去把一些运行着的代码停下来
				//本地或者网络请求来记录用户的配置信息或者偏好设置
				beforeDestroy() {
					console.log("销毁实例之前",this.msg)
					
				},

				//实例销毁了
				//钩子调用后 才销毁  做最后的挽救
				//从技术的角度来说  可以在这个方法打开其他程序,然后销毁这个程序
				destroyed() {
					console.log("实例销毁了",this.msg)
				}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值