vue前端面试题

1、vue的生命周期？

---

1、vue的生命周期？

vue生命周期分为四个阶段
第一阶段（创建阶段）：beforeCreate，created
第二阶段（挂载阶段）：beforeMount（render），mounted
第三阶段（更新阶段）：beforeUpdate，updated
第四阶段（销毁阶段）：beforeDestroy，destroyed

beforeCreate：

官网：在实例初始化之后,进行数据侦听和事件/侦听器的配置之前同步调用。

详细：在这个阶段，数据是获取不到的，并且真实dom元素也是没有渲染出来的

created: 

vue的生命周期就是vue实例从创建到销毁的过程，即指从创建、初始化数据、编译模板、挂载Dom到渲染、更新到渲染、销毁等一系列流程。它主要分为8个阶段。创建前后、载入前后、更新前后、销毁前、销毁后以及一些场景的生命周期。如图： 

---

2、vue常用的指令？

v-once：只会执行一次渲染，当数据发生改变时，不会再变化

v-if v-show：控制元素是否显示

v-for ：遍历

v-bind：数据双向绑定

v-on：事件绑定

• • v-bind 的用法是：v-bind:属性名="数据"，或者简写为 :属性名="数据"。它将 HTML 元素的某个属性绑定到 Vue 实例中的数据上。
  • v-model 的用法是：v-model="数据"。它一般用于表单元素（如 input、textarea、select）上，将表单元素的值与 Vue 实例中的数据双向绑定，从而实现输入和数据状态的同步更新。

---

3、keep—alive？ 

在 Vue.js 中，<keep-alive> 组件是用来保留组件状态或避免重新渲染的一个抽象组件。当组件在 <keep-alive> 内被切换时，它的状态会被保留，而不是每次切换都重新渲染。

使用场景：

1. 保留组件状态：当需要在组件之间切换时，保留组件的状态，而不是每次都重新渲染该组件时，可以使用 <keep-alive> 组件。

2. 缓存组件：当需要缓存某些组件的状态，以便在用户返回时不需要重新加载时，也可以使用 <keep-alive> 组件。

---

4、vue父子组件之前的信息传递

父 => 孩子 props

孩子 => 父亲 $emit