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

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/891650.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

大型模型运行过程概述

整体过程 大模型,如大型语言模型(LLM),其生命周期主要分为两个阶段:训练和推理。这两个过程有着不同的目标、资源需求和技术挑战。 大模型的训练是一个复杂且资源密集的过程,它首先需要收集和准备大量的高…

PostgreSQL 表达式

PostgreSQL中的表达式是一种强大的工具,用于在数据库查询中处理和计算数据。它们由一个或多个值、运算符和PostgreSQL函数组合而成,类似于公式,并用于求值【1†source】。 在PostgreSQL中,表达式可以分为不同类型,如布…

带虚继承的类对象模型

文章目录 1、代码2、 单个虚继承3、vbptr是什么4、虚继承的多继承 1、代码 #include<iostream> using namespace std;class Base { public:int ma; };class Derive1 :virtual public Base { public:int mb; };class Derive2 :public Base { public:int mc; };class Deri…

责任链模式应用

牢记于心 职责单一: 责任链模式可以将每个验证逻辑封装到一个独立的处理器中&#xff0c;每个处理器负责单一的验证职责&#xff0c;符合单一职责原则。 可扩展性: 增加新的验证逻辑时&#xff0c;只需添加新的处理器&#xff0c;而不需要修改现有的代码。 清晰的流程: 将所…

信号的产生、处理

一、信号的概念 信号是linux系统提供的一种&#xff0c;向指定进程发送特定事件的方式。收到信号的进程&#xff0c;要对信号做识别和处理。信号的产生是异步的&#xff0c;进程在工作过程中随时可能收到信号。 信号的种类分为以下这么多种&#xff08;用指令kill -l查看&…

如何在 Windows 10/11 上录制带有音频的屏幕 [3 种简单方法]

无论您是在上在线课程还是参加在线会议&#xff0c;您都可能需要在 Windows 10/11 上录制带有音频的屏幕。互联网上提供了多种可选方法。在这里&#xff0c;本博客收集了 3 种最简单的方法来指导您如何在 Windows 10/11 上使用音频进行屏幕录制。请继续阅读以探索&#xff01; …

卸载干净 IDEA(图文讲解)

目录 1、卸载 IDEA 程序 2、注册表清理 3、残留清理 1、卸载 IDEA 程序 点击屏幕左下角 Windows 图标 -> 设置-控制面板->intellij idea 勾选第一栏 Delete IntelliJ IDEA 2022.2 caches and local history&#xff0c;表示同时删除 IDEA 本地缓存以及历史。 Delete I…

若依使用 Undertow 替代 Tomcat 容器

文章目录 需求提出应用场景解决思路注意事项完整代码第一步&#xff1a;在 ruoyi-framework/pom.xml 文件中进行依赖配置第二步&#xff1a;修改 application.yml 配置文件第三步&#xff1a;修改文件上传工具类 FileUploadUtils.java 运行结果 需求提出 在开发若依框架的前后…

第 23 章 JSON

第 23 章 JSON 23.1 语法 JSON 语法支持表示 3 种类型的值。 ❑ 简单值&#xff1a;字符串、数值、布尔值和 null 可以在 JSON 中出现&#xff0c;就像在 JavaScript 中一样。特殊值 undefined 不可以。 ❑ 对象&#xff1a;第一种复杂数据类型&#xff0c;对象表示有序键/值…

STM32-笔记34-4G遥控灯

4G接线 一、项目需求 服务器通过4G模块远程遥控开关灯。 二、项目实现 复制项目文件夹38-wifi控制风扇项目 重命名为39-4G遥控点灯 打开项目文件 加载文件 main.c #include "sys.h" #include "delay.h" #include "led.h" #include "ua…

数据结构考前一天

线性表&#xff1a;矩阵&#xff0c;链表&#xff08;单链表必考&#xff09; 栈和队列&#xff1a;出入判断&#xff0c;括号匹配&#xff0c;中缀转后缀 字符串数组&#xff1a;模式匹配next&#xff0c;nextval数组&#xff0c;数组寻址&#xff0c;三角矩阵对应一维数组k…

Frontend - 分页(针对 python / Django )

目录 一、同个文件内&#xff08;方式一&#xff09; 1. 前端 html 2. 定义分页界面 3. 获取分页数据 4.后端根据前端分页需求&#xff0c;整理分页数据 5.显示情况 6. JsonResponse 相关知识 二、不同文件内依旧有效&#xff08;方式二&#xff0c;更优化&#xff09;…

【快速实践】深度学习 -- 数据曲线平滑化

希望对你有帮助呀&#xff01;&#xff01;&#x1f49c;&#x1f49c; 如有更好理解的思路&#xff0c;欢迎大家留言补充 ~ 一起加油叭 &#x1f4a6; 欢迎关注、订阅专栏 【深度学习从 0 到 1】谢谢你的支持&#xff01; 在观察数据结果时&#xff0c;我们通常希望获得整体趋…

SQLite 进阶:扩展功能与最佳实践

在前两篇文章中&#xff0c;我们探讨了 SQLite 的基础知识和高级功能。本篇将进一步探讨 SQLite 的扩展功能&#xff0c;包括加密、与其他工具的集成、多线程使用、性能优化&#xff0c;以及如何实现跨平台兼容性。 数据加密 SQLite 本身不直接支持加密&#xff0c;但可以通过…

Postgresql 命令还原数据库

因为PgAdmin打不开&#xff0c;但是数据库已经安装成功了&#xff0c;这里借助Pg命令来还原数据库 C:\Program Files\PostgreSQL\15\bin\psql.exe #链接数据库 psql -U postgres -p 5432#创建数据库 CREATE DATABASE "数据库名称"WITHOWNER postgresENCODING UTF8…

minikube安装k8s

一、安装k8s版本 export REGISTRY_MIRRORhttps://registry.cn-hangzhou.aliyuncs.com curl -sSL https://kuboard.cn/install-script/v1.30.x/install_kubelet.sh | sh -s 1.30.0 二、安装docker及minikube useradd docker passwd docker 密码也设置为docker #创建docker组…

JavaScript 基础2

js的运算符 算数运算符 相加求和&#xff0c;如果用在字符串则是拼接 -相减求差 *相乘求积 /相除求商 %模除求余 具体用法如下 let num 154 let num2 15 document.write(numnum2) document.write(<br>) document.write(num-num2) document.write(<br>) do…

《Xsens动捕与人形机器人训练》讲座将于1月9日下午2:30在线上召开

《Xsens动捕与人形机器人训练》讲座将于1月9日下午2:30在线上召开&#xff0c;本次讲座中来自Xsens的人形机器人与动捕技术专家Jeffrey Muller与Dennis Kloppenburg不仅将就Xsens动作捕捉系统与人形机器人行为训练中的实际应用进行详细讲解&#xff0c;同时还会对目前大家所关注…

ArcGIS Server 10.2授权文件过期处理

新的一年&#xff0c;arcgis server授权过期了&#xff0c;服务发不不了。查看ecp授权文件&#xff0c;原来的授权日期就到2024.12.31日。好吧&#xff0c;这里直接给出处理方法。 ArcGIS 10.2安装时&#xff0c;有的破解文件中会有含一个这样的注册程序&#xff0c;没有的话&…

Fabric部署-docker安装

一&#xff1a;安装docker 1.先卸载旧docker apt-get remove docker docker-engine docker.io containerd runc PS&#xff1a;新开的虚拟机输入命令后是这样的。 2.更新软件包 在终端中执行以下命令来更新Ubuntu软件包列表和已安装软件的版本: sudo apt update sudo apt …