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,一经查实,立即删除!

相关文章

带虚继承的类对象模型

文章目录 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…

信号的产生、处理

一、信号的概念 信号是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…

STM32-笔记34-4G遥控灯

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

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;我们通常希望获得整体趋…

Postgresql 命令还原数据库

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

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 …

Scrum中敏捷项目经理(Scrum Master)扮演什么角色?

敏捷开发模式已经逐渐被主流的软件研发团队所接受&#xff0c;其中Scrum是最具代表性的敏捷方法之一。Scrum框架中有三个核心角色&#xff1a;Product Owner&#xff08;PO&#xff09;、Scrum Master&#xff08;SM&#xff09;和Development Team&#xff08;DT&#xff09;。…

计算机毕设-基于springboot的教务管理系统的设计与实现(附源码+lw+ppt+开题报告)

博主介绍&#xff1a;✌多个项目实战经验、多个大型网购商城开发经验、在某机构指导学员上千名、专注于本行业领域✌ 技术范围&#xff1a;Java实战项目、Python实战项目、微信小程序/安卓实战项目、爬虫大数据实战项目、Nodejs实战项目、PHP实战项目、.NET实战项目、Golang实战…

ROS导航使用贝塞尔曲线对全局路径进行平滑处理

文章目录 前言一、贝塞尔曲线的使用二、全局路经修改三、结果对比 前言 ROS原生的全局路径规划GlobalPlanner包含A*和Dijkstra&#xff0c;两者原理基本相同&#xff0c;能够规划出从起点到终点的路径&#xff0c;但是由于栅格地图存在锯齿形&#xff0c;得到的全局路径也会出…

GIT 企业级开发学习 1

本节主要命令&#xff1a; git init ls 不能列出 .git ls -a 列出 .git 1. 初始化 Git 仓库 git init • 初始化一个新的 Git 仓库&#xff0c;在当前目录下生成一个 .git 隐藏文件夹&#xff0c;用于存储版本控制信息。 2. 查看隐藏文件 ls -a • 使用 ls -a 显示隐藏文件…

【从零开始入门unity游戏开发之——unity篇05】unity6基础入门——运行游戏按钮、Game游戏窗口和Project项目窗口介绍

文章目录 运行游戏按钮、Game游戏窗口和Project项目窗口一、运行游戏按钮二、Game游戏窗口1、右上角设置1.1 如果没有相机渲染则发出警告1.2 在”编程模式”下清除每一帧1.3 窗口最大化 2、上方工具&#xff08;1&#xff09;切换手机模拟器&#xff08;2&#xff09;切换不同显…

Java 定时任务发送邮件

163邮箱为例 1、添加依赖 <!-- mail-starter --><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-mail</artifactId></dependency> 2、编写配置&#xff0c;smtp默认端口25&#xff0c…

【深度学习进阶】基于CNN的10种物体识别项目

介绍 基于卷积神经网络&#xff08;CNN&#xff09;的猫狗图片分类项目是机器学习领域中的一种常见任务&#xff0c;它涉及图像处理和深度学习技术。以下是该项目的技术点和流程介绍&#xff1a; 技术点 卷积神经网络 (CNN): CNN 是一种专门用于处理具有类似网格结构的数据的…

开发培训-慧集通(iPaaS)集成平台脚本开发Groovy基础培训视频

‌Groovy‌是一种基于Java虚拟机&#xff08;JVM&#xff09;的敏捷开发语言&#xff0c;结合了Python、Ruby和Smalltalk的许多强大特性。它旨在提高开发者的生产力&#xff0c;通过简洁、熟悉且易于学习的语法&#xff0c;Groovy能够与Java代码无缝集成&#xff0c;并提供强大…