0
点赞
收藏
分享

微信扫一扫

Vue高频面试题三——生命周期函数

单调先生 2022-04-13 阅读 63

一.Vue中生命周期函数一共有八个

 

1.beforeCreate()

表示刚初始化一个Vue空的实例对象,这个对象上只有默认的事件,其它都没创建

2.重点created()

在created()中 data和methods都已经初始化完成,可使用 最早, 一般打开组件就要渲染的函数就放在created()中

 输出:

 

3.beforeMouunted()

表示:模板已经在内存中编译完成,但是尚未把模板渲染在页面中,在beforeMount()执行的时候,页面中的元素还没有被真正替换过来,只是之前写的一些模板字符串

输出:{{msg}}拿不到

 

 

4.重点mounted()

表示内存中的模板已经挂载到页面上,用户可以看到渲染的页面。若要通过某些操作页面上的DOM节点,最早在mounted中

输出:OK   能拿到

 

 

5.beforeupdate()

data中的数据改变触发,0次-无数次

 可以监听shujubianhua

6.updata()

根据data中的数据,更新最新的DOM节点,并进行挂载

7.beforeDestryed()

从运行状态转到销毁状态,data,methid,都处于可用状态,可操纵DOM节点,

 

输出:OK

8.destryed()

数据全被销毁,不可以直接操作DOM

---------------------------------------------------------------------------------------------分割线

二.还有两个特殊生命周期函数activated()   deactivated() 

如果加了keep-aliva  就会触发这两个生命周期函数

activated:keep-alive被激活时调用

deactivated:keep-alive销毁时调用

  重点  高频面试题

 1.如果加入了keep-alive,第一次会调用哪些生命周期函数?

答:beforeCreated--->created-->beforeMounted-->mounted-->activated

 2.如果加入了keep-alive,第二次或N次会调用哪些生命周期函数?

答:只会执行  activated()生命周期函数 ,因为keep-alive有缓存机制,不会再重新调用渲染,所以只调用激活时生命周期函数。

举报

相关推荐

0 条评论