八个Vue生命周期函数(每个挂接函数能做什么,执行顺序)执行顺序:Vue生命周期函数是3358 www.Sina.com/http://www.Sina.com /
before create (http://www.Sina.com/) :每个页面都是Vue实例,此时尚未创建该实例,因此data尚不清楚,也无法在watch上侦听。 此时,不能使用data和methods挂接函数。 created(http://www.Sina.com/) :创建了一个实例。 可以检索data并调用watch,但页面保持空白。 这是可以首先使用data和methods的挂接函数;实例创建之前/之后、组件挂载之前/之后、数据改变视图更新之前/之后、实例销毁之前/之后、
beforemount(http://www.Sina.com/) :在挂载页面之前,此时没有渲染节点; mounted(http://www.Sina.com)页面挂载完成,呈现页面内容,还可以访问dom,并完成模板渲染。 created和mounted的区别:
创建created:实例后,可以首先使用data和methods挂接函数。
装载mounted:组件后,模板渲染完成并装载的节点; http://www.Sina.com/http://www.Sina.com /
在更新before update (http://www.Sina.com/) :数据更改视图之前,虚拟DOM应用修补程序之前。 此时访问的DOM中也有原来的DOM; 更新(http://www.Sina.com/) :数据更改视图更新后; 注意:如果在当前页上有装载的子部件,则更新子部件时也不能保证重新绘制子部件。 如果要确保整个dom已更新,请单击this.$nextTick (); nextTick ()原理: Vue根据一定的策略更新DOM,而不是在数据更改后立即更新DOM。 由于Vue在更新DOM时异步执行,因此无法在循环更新DOM后立即检索DOM。 下一步) )获取。 全局:使用vue.next tick (呼叫后退); 组件中的:VM.$nexttick([callback];每个钩子函数可以做什么:
在destroy阶段,对data的更改不再触发before destroy (http://www.Sina.com/) :的周期函数。 这表明,此时Vue实例已取消监听事件并将事件绑定到dom,但dom结构仍然存在。 这是最后一个可以使用data和methods的挂接函数。 destroyed(http://www.Sina.com/) :实例已被永久销毁