几个关于Vue的面试题

Posted 2021-03-05 awei313558147

1、Vue的生命周期

beforeCreate（创建前） 在数据观测和初始化事件还未开始

created（创建后） 完成数据观测，属性和方法的运算，初始化事件，$el属性还没有显示出来

beforeMount（载入前） 在挂载开始之前被调用，相关的render函数首次被调用。实例已完成以下的配置：编译模板，把data里面的数据和模板生成html。注意此时还没有挂载html到页面上。

mounted（载入后） 在el 被新创建的 vm.$el 替换，并挂载到实例上去之后调用。实例已完成以下的配置：用上面编译好的html内容替换el属性指向的DOM对象。完成模板中的html渲染到html页面中。此过程中进行ajax交互。

beforeUpdate（更新前） 在数据更新之前调用，发生在虚拟DOM重新渲染和打补丁之前。可以在该钩子中进一步地更改状态，不会触发附加的重渲染过程。

updated（更新后） 在由于数据更改导致的虚拟DOM重新渲染和打补丁之后调用。调用时，组件DOM已经更新，所以可以执行依赖于DOM的操作。然而在大多数情况下，应该避免在此期间更改状态，因为这可能会导致更新无限循环。该钩子在服务器端渲染期间不被调用。

beforeDestroy（销毁前） 在实例销毁之前调用。实例仍然完全可用。

destroyed（销毁后） 在实例销毁之后调用。调用后，所有的事件监听器会被移除，所有的子实例也会被销毁。该钩子在服务器端渲染期间不被调用。

 

什么是vue生命周期？

Vue 实例从创建到销毁的过程，就是生命周期。也就是从开始创建、初始化数据、编译模板、挂载Dom→渲染、更新→渲染、卸载等一系列过程，我们称这是 Vue 的生命周期。

vue生命周期的作用是什么？
它的生命周期中有多个事件钩子，让我们在控制整个Vue实例的过程时更容易形成好的逻辑。

vue生命周期总共有几个阶段？
它可以总共分为8个阶段：创建前/后, 载入前/后,更新前/后,销毁前/销毁后

第一次页面加载会触发哪几个钩子？
第一次页面加载时会触发 beforeCreate, created, beforeMount, mounted 这几个钩子

DOM 渲染在 哪个周期中就已经完成？
DOM 渲染在 mounted 中就已经完成了

简单描述每个周期具体适合哪些场景？
生命周期钩子的一些使用方法： beforecreate : 可以在这加个loading事件，在加载实例时触发 created : 初始化完成时的事件写在这里，如在这结束loading事件，异步请求也适宜在这里调用 mounted : 挂载元素，获取到DOM节点 updated : 如果对数据统一处理，在这里写上相应函数 beforeDestroy : 可以做一个确认停止事件的确认框 nextTick : 更新数据后立即操作dom

2、 组件之间的传值

父组件与子组件传值
父组件通过标签上面定义传值
子组件通过props方法接受数据

子组件向父组件传递数据
子组件通过$emit方法传递参数

 

3、vue几种常用的指令

v-if：判断是否隐藏；v-for：数据循环出来；v-bind:class：绑定一个属性；v-model：实现双向绑定
 

 

4、v-if 和 v-show 区别

v-if按照条件是否渲染，v-show是display的block或none

 

 

5、v-model是什么?怎么使用？vue中标签怎么绑定事件？

v-model用于表单数据的双向绑定，其实它就是一个语法糖，这个背后就做了两个操作：

• v-bind绑定一个value属性
• v-on指令给当前元素绑定input事件

 

 

使用方法如下：

v-model很好地体现了vue双向绑定的理念。
单向绑定非常简单，就是把Model绑定到View，当我们用javascript代码更新Model时，View就会自动更新。有单向绑定，就有双向绑定。
如果用户更新了View，Model的数据也自动被更新了，这种情况就是双向绑定。
什么情况下用户可以更新View呢？填写表单就是一个最直接的例子。当用户填写表单时，View的状态就被更新了，如果此时MVVM框架可以自动更新Model的状态，那就相当于我们把Model和View做了双向绑定。
双向数据绑定=单向数据绑定+UI事件监听

vue绑定事件
1.通过指令 v-on：事件名=“函数名”绑定事件 eg:<button v-on:click="doThis"></button>
2.通过语法 @事件名=“函数名”绑定事件 eg:<button @click.stop="doThis"></button>

6、为什么要进行前后端分离？前后端分离的优势在哪里？劣势在哪里？

优点：前端专门负责前端页面和特效的编写，后端专门负责后端业务逻辑的处理，前端追求的是页面美观、页面流畅、页面兼容等。后端追求的是三高（高并发、高可用、高性能）让他们各自负责各自的领域，让专业的人负责处理专业的事情，提高开发效率

缺点：1 、当接口发生改变的时候，前后端都需要改变

           2、 当发生异常的时候，前后端需要联调--联调是非常浪费时间的