前端面试真题-vue(一)

发布时间 2023-06-29 15:38:19作者: li&り&Lee

1.说说对vue的理解

 (1) vue.js是一种用于创建用户界面的渐进式的javascript框架

 (2)也是用于创建单页面应用的web应用框架。

 (3)vue的核心库只关心视图层,使得数据和视图的双向绑定变得快捷

 (4)由于vue的核心库只关心视图层,所以不仅可以与其他库和现有项目整合,也可以添加更多的vue插件,实现更复杂的功能  

2.vue的特点是:

  (1)声明式渲染:vue允许我们使用模板语法来声明式地将数据绑定到DOM,而不是直接操作DOM

  (2)组件化:vue鼓励适用组件化的方式构建应用,使得代码易于复用和拓展

  (3)双向数据绑定:vue使用v-model实现双向数据绑定,当数据变化时,视图也会更新,相反,当视图更新时,数据也会同步变化

  (4)虚拟dom:vue使用虚拟dom技术,可以避免不必要的dom操作,提高性能

  (5)易于集成:Vue易于与其他框架和库整合,可以在现有项目中逐步引入,同时它提供了丰富的插件和生态系统,让开发者可以根据需要使用

  (6)易于学习:Vue的学习曲线较为平缓,文档清晰易懂,对于初学者和有经验的开发者来说都非常友好

3.v-if和v-show的区别

(1)v-if和v-show的共同点:都能控制元素是否在页面上显示

(2)v-if和v-show的不同点:

         控制手段不同:v-show隐藏是为该元素添加css--display:none,dom元素依然存在;

                                  v-if显示隐藏是将dom整个添加或删除;

         编译过程不同:v-show只是简单的基于css切换;

                                   v-if切换有一个局部编译/卸载的过程,切换过程中合适地销毁和重建内部的事件监听和子组件

         编译条件不同:v-show由false变为true的时候并不会触发组件的生命周期;

                                  v-if是真正的条件渲染,它会确保切换过程中条件块内的事件监听器和子组件适当地被销毁和重建,只有渲染条件为假时,并不做操作,直到为真时才渲染

(3)v-show和v-if的使用场景:

         需要频繁切换,使用v-show更好;

         在运行时条件很少改变,使用v-if更好;

4.vue的生命周期

   vue的生命周期指的是vue实例从创建到销毁的全过程,vue所有的功能都是围绕其生命周期进行的,在生命周期的不同阶段调用不同的钩子函数,可以实现组件数据管理和dom渲染两大重要功能。

   vue的八个生命周期钩子函数:

(1)beforeCreate

(2)created

(3)beforeMounte

(4)mounted

(5)beforeUpdate

(6)updated

(7)beforedestroy

(8)destroyed