vue面试题|[2025-1-3]

1.v-if和v-show的区别?

都是可以控制元素的显示和隐藏

1.v-show是控制元素的display值来让元素显示和隐藏;v-if显示(隐藏)时会把整个DOM元素添加(删除)

2.v-show只是简单的css切换;v-if有一个局部编译/卸载的过程,切换这个过程中会适当的销毁和重建内部的事件监听和子组件

3.v-show的切换效率比较高;v-if的效率比较低;

2.如何理解MVVM?

是Model-View-ViewModel的缩写。前端开发的架构模式。

M:模型,对应的就是data的数据

V:视图,用户界面,DOM

VM:视图模型,Vue的实例对象,连接View和Model的桥梁

核心就是提供对View和Model的双向数据绑定。当数据变化的时候,ViewModel能监听到数据的变化,自动更新视图;当用户操作视图的时候,ViewModel也可以监听到视图的变化,然后通知数据进行改动,这就实现了双向绑定。

ViewModel通过双向绑定把ViewModel连接起来,他们之间的同步是自动的,不需要人为干涉,所以我们只需要关注业务逻辑即可,不需要操作DOM,同时也不需要关注数据的状态问题,因为她是由MVVM统一管理。

3.v-for中的key值的作用是什么?

key属性是DOM元素的唯一标识

作用:

1.提高虚拟DOM的更新

2.若不设置key,可能会触发一些bug

3.为了触发过渡效果

4.说一下你对vue生命周期的理解

组件从创建到销毁的过程就是它的生命周期。

创建

beforeCreate:在这个阶段属性和方法都不能使用

created:这里是实例创建完成之后,完成了数据监测,可以使用数据,修改数据,不会触发updated,也不会更新视图

挂载

beforeMount:完成了模板的编译,虚拟DOM也完成创建,即将渲染,修改数据,不会触发updated

mounted:把编译好的模板挂载到页面,这里可以发送异步请求也可以访问DOM节点

更新

beforeUpdate:组件数据更新之前使用,数据是新的,页面上的数据是旧的,组件即将更新,准备渲染,可以改数据

updated:render重新做了渲染,这时数据和页面都是新的,避免在此更新数据

销毁

beforeDestroy:实例销毁前,在这里实例还可以用,可以清除定时器等等

destroyed:组件已经销毁了,全部都销毁

使用了keep-alive时会多出两个周期:

activated:组件激活时

deactivited:组件被销毁时

5.在created和mounted去请求数据,有什么区别?

created:在渲染前调用,通常先初始化属性,然后做渲染

mounted:在模板渲染完成后,一般都是初始化页面后,再对元素节点进行操作

在这里请求数据可能会出现闪屏的问题,created里不会

一般用created请求数据比较多

请求数据对DOM有影响,那么使用created

如果请求的数据对DOM无关,可以放在mounted

相关推荐
wuhen_n3 分钟前
JavaScript数据结构深度解析:栈、队列与树的实现与应用
前端·javascript
我是一只puppy9 分钟前
使用AI进行代码审查
javascript·人工智能·git·安全·源代码管理
颜酱10 分钟前
从二叉树到衍生结构:5种高频树结构原理+解析
javascript·后端·算法
狗哥哥24 分钟前
微前端路由设计方案 & 子应用管理保活
前端·架构
TT哇1 小时前
【实习 】银行经理端两个核心功能的开发与修复(银行经理绑定逻辑修复和线下领取扫码功能开发)
java·vue.js
前端大卫1 小时前
Vue3 + Element-Plus 自定义虚拟表格滚动实现方案【附源码】
前端
却尘1 小时前
Next.js 请求最佳实践 - vercel 2026一月发布指南
前端·react.js·next.js
ccnocare1 小时前
浅浅看一下设计模式
前端
Lee川1 小时前
🎬 从标签到屏幕:揭秘现代网页构建与适配之道
前端·面试
Ticnix2 小时前
ECharts初始化、销毁、resize 适配组件封装(含完整封装代码)
前端·echarts