WEB前端高频面试题（五）—— Vue 八股文

Vue面试高频知识点：生命周期、组件通信与优化技巧

原创

已于 2023-08-23 13:04:37 修改 · 670 阅读

9 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #前端 #javascript

于 2023-08-23 12:58:55 首次发布

等风来，不如追风去。 —— 一禅小和尚

Vue高频面试题

一、Vue生命周期

1. 1有哪些生命周期

系统自带：
beforeCreate
created
beforeMount
mounted
beforeUpdate
updated
beforeDestroy
destroyed

1.2 一旦进入到页面或者组件，会执行哪些生命周期，顺序。

beforeCreate
created
beforeMount
mounted

1.3 在哪个阶段有$el，在哪个阶段有$data

beforeCreate 啥也没有
   created 有data没有el
   beforeMount 有data没有el
   mounted 都有

1.4 如果加入了keep-alive会多哪两个生命周期

activated、deactivated

1.5 如果加入了keep-alive，第一次进入组件会执行哪些生命周期？

beforeCreate
created
beforeMount
mounted
activated

6. 如果加入了keep-alive，第二次或者第N次进入组件会执行哪些生命周期？

只执行一个生命周期：activated

二、v-show和v-if是干什么？有什么区别？

2.1 v-show

 显示和隐藏 : display:none进行隐藏 、display:block进行显示

2.2 v-if

 创建和删除：remove、append

2.3 区别

 显示和隐藏用：v-show
 创建和删除用：v-if
 
 频繁切换用：v-show
 不频繁切换用：v-if 
 
 首次加载：用v-if，不用v-show
 为什么：
             如果用v-if可以没有这个盒子，然后再通过v-if进行创建（但是第一次进入页面是没有这个盒子，是不加载的）。