Vue 生命周期总共分为几个阶段?
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Vue 生命周期总共分为几个阶段?相关的知识,希望对你有一定的参考价值。
参考技术A Vue 实例从创建到销毁的过程,就是生命周期。也就是从开始创建、初始化数据、编译模板、挂载 Dom→渲染、更新→渲染、卸载等一系列过程,我们称这是 Vue 的生命周期。
1、beforeCreate
在实例初始化之后,数据观测 (data observer) 和 event/watcher 事件配置之前被调
用
2、created
在实例创建完成后被立即调用。在这一步,实例已完成以下的配置:数据观测 (data
observer)属性和方法的运算,watch/event 事件回调。然而,挂载阶段还没开始,$el 属性目
前不可见
3、beforeMount在挂载开始之前被调用:相关的 render 函数首次被调用
4、mounted
el 被新创建的 vm.$el 替换,并挂载到实例上去之后调用该钩子,如果 root 实例挂载了
一个文档内元素,当 mounted 被调用时 vm.$el 也在文档内
5、beforeUpdate
数据更新时调用,发生在虚拟 DOM 打补丁之前。这里适合在更新之前访问现有的
DOM,比如手动移除已添加的事件监听器,该钩子在服务器端渲染期间不被调用,因为只有初
次渲染会在服务端进行
6、updated
由于数据更改导致的虚拟 DOM 重新渲染和打补丁,在这之后会调用该钩子
7、activated
keep-alive 组件激活时调用。该钩子在服务器端渲染期间不被调用
8、deactivated
keep-alive 组件停用时调用。该钩子在服务器端渲染期间不被调用
9、beforeDestroy
实例销毁之前调用。在这一步,实例仍然完全可用。该钩子在服务器端渲染期间不被
调用
10、destroyed
Vue 实例销毁后调用。调用后,Vue 实例指示的所有东西都会解绑定,所有的事件
监听器会被移除,所有的子实例也会被销毁。该钩子在服务器端渲染期间不被调用
11、errorCaptured(2.5.0+ 新增)
当捕获一个来自子孙组件的错误时被调用。此钩子会收到三个参数:错误对象、发生
错误的组件实例以及一个包含错误来源信息的字符串,此钩子可以返回 false 以阻止该错误继
续向上传播
vue生命周期总共有几个阶段?
vue生命周期分为8个阶段,即分别是创建前、创建后、载入前、载入后、更新前、更新后、销毁前、销毁后。 VUE是iOS和Android平台上的一款Vlog社区与编辑工具,允许用户通过简单的操作实现Vlog的拍摄、剪辑、细调、和发布,记录与分享生活,还可以在社区直接浏览他人发布的Vlog,与Vloggers互动。随着手机摄像头的发展,越来越多的人开始使用手机拍照和摄像。 VUE软件通过点按改变视频的分镜数实现简易的剪辑效果,而剪辑能够让视频传达更多的信息。同时,该软件中有12款滤镜供用户选择,切换至前置摄像头会出现自然的自拍美颜功能。VUE支持40款手绘贴纸,还可以编辑贴纸的出现时间。 参考技术A Vue生命周期总共可以分为8个阶段:创建前后, 载入前后,更新前后,销毁前销毁后,以及一些特殊场景的生命周期生命周期
描述
beforeCreate 组件实例被创建之初
created 组件实例已经完全创建
beforeMount 组件挂载之前
mounted 组件挂载到实例上去之后
beforeUpdate 组件数据发生变化,更新之前
updated 数据数据更新之后
beforeDestroy 组件实例销毁之前
destroyed 组件实例销毁之后
activated keep-alive 缓存的组件激活时
deactivated keep-alive 缓存的组件停用时调用
errorCaptured 捕获一个来自子孙组件的错误时被调用 参考技术B
beforeCreate:在 new 一个 vue 实例后,只有一些默认的生命周期钩子和默认事件,其他的东西都还没创建。
created:data 和 methods 都已经被初始化好了。(如果要调用 methods 中的方法,或者操作 data 中的数据,最早可以在这个阶段中操作)
beforeMount:在内存中已经编译好了模板了,但是还没有挂载到页面中,此时,页面还是旧的。
mounted:Vue 实例已经初始化完成了。此时组件脱离了创建阶段,进入到了运行阶段。 (如果我们想要通过插件操作页面上的 DOM 节点,最早可以在和这个阶段中进行)
beforeUpdate:页面中的显示的数据还是旧的,data 中的数据是更新后的, 页面还没有和最新的数据保持同步。
updated:页面显示的数据和 data 中的数据已经保持同步了,都是最新的。
beforeDestroy:Vue 实例从运行阶段进入到了销毁阶段,这个时候上所有的 data 和 methods , 指令, 过滤器 ……都是处于可用状态。还没有真正被销毁。
destroyed:这个时候上所有的 data 和 methods , 指令, 过滤器 ……都是处于不可用状态。组件已经被销毁了。
以上是关于Vue 生命周期总共分为几个阶段?的主要内容,如果未能解决你的问题,请参考以下文章