常见前端面试之VUE面试题汇总五

13. assets 和 static 的区别

相同点: assets 和 static 两个都是存放静态资源文件。项目中所 需要的资源文件图片,字体图标,样式文件等都可以放在这两个文件 下,这是相同点

不相同点:assets 中存放的静态资源文件在项目打包时,也就是运 行 npm run build 时会将 assets 中放置的静态资源文件进行打包 上传,所谓打包简单点可以理解为压缩体积,代码格式化。而压缩后 的静态资源文件最终也都会放置在 static 文件中跟着 index.html 一同上传至服务器。static 中放置的静态资源文件就不会要走打包 压缩格式化等流程,而是直接进入打包好的目录,直接上传至服务器。

因为避免了压缩直接进行上传,在打包时会提高一定的效率,但是 static 中的资源文件由于没有进行压缩等操作,所以文件的体积也 就相对于 assets 中打包后的文件提交较大点。在服务器中就会占据 更大的空间。

建议: 将项目中 template 需要的样式文件 js 文件等都可以放置在 assets 中,走打包这一流程。减少体积。而项目中引入的第三方的 资源文件如 iconfoont.css 等文件可以放置在 static 中,因为这 些引入的第三方文件已经经过处理,不再需要处理,直接上传。

14. delete 和 Vue.delete 删除数组的区别

delete 只是被删除的元素变成了 empty/undefined 其他的元素的 键值还是不变。

Vue.delete 直接删除了数组 改变了数组的键值。

15. Vue 模版编译原理

vue 中的模板 template 无法被浏览器解析并渲染,因为这不属于浏 览器的标准,不是正确的 HTML 语法,所有需要将 template 转化成一 个 JavaScript 函数,这样浏览器就可以执行这一个函数并渲染出对 应的 HTML 元素,就可以让视图跑起来了,这一个转化的过程,就成 为模板编译。模板编译又分三个阶段,解析 parse,优化 optimize,生成 generate,最终生成可执行函数 render。

解析阶段:使用大量的正则表达式对 template 字符串进行解析,将 标签、指令、属性等转化为抽象语法树 AST。

优化阶段:遍历 AST,找到其中的一些静态节点并进行标记,方便在 页面重渲染的时候进行 diff 比较时,直接跳过这一些静态节点,优 化 runtime 的性能。

生成阶段:将最终的 AST 转化为 render 函数字符串。

16. vue 初始化页面闪动问题

使用 vue 开发时,在 vue 初始化之前,由于 div 是不归 vue 管的,所 以我们写的代码在还没有解析的情况下会容易出现花屏现象,看到类 似于{{message}}的字样,虽然一般情况下这个时间很短暂,但是还 是有必要让解决这个问题的。

首先:在 css 里加上以下代码:

如 果 没 有 彻 底 解 决 问 题 , 则 在 根 元 素 加 上 style="display:

none;" :style="{display: 'block'}"

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

IoTDB 集群环境搭建

什么是IoTDB IoTDB(Internet of Things Database)是一个专门设计用于存储和管理大规模物联网(IoT)数据的开源时序数据库系统。它专注于高效地存储、查询和分析时间序列数据,特别适用于物联网应用中的大量实时数据。 Io…

视频云存储平台EasyCVR视频汇聚平台关于机电设别可视化管理平台可实施设计方案

随着工业化进程的不断发展,机电设备在各行各业中扮演着重要的角色。然而,由于机电设备种类繁多、数量庞大,包括生产机械、建筑器械、矿用器械、制药器械、食品机械等,传统的手动管理方式已经无法满足对设备进行精细化管理的需求。…

Linux知识点 -- Linux多线程(三)

Linux知识点 – Linux多线程(三) 文章目录 Linux知识点 -- Linux多线程(三)一、线程同步1.概念理解2.条件变量3.使用条件变量进行线程同步 二、生产者消费者模型1.概念2.基于BlockingQueue的生产者消费者模型3.单生产者单消费者模…

一篇文章告诉你,为什么要使用Javascript流程图来可视化进程?(下)

DHTMLX Diagram库是有各种类型的图组成的,其中最广泛使用的是JavaScript流程图,它可以显示任何类型的的工作流、过程或系统,您可以下载DHTMLX Diagram的评估版并亲自试用。 在上文中(点击这里回顾>>)&#xff0…

动态规划之路径问题

路径问题 1. 不同路径(medium)2. 不同路径II(medium)3. 礼物最大值(medium)4. 下降路径最小和(medium)5. 最⼩路径和(medium)6. 地下城游戏(hard&…

7.elasticsearch同步工具-logstah

1.logstah Logstash 是一个用于数据处理和转换的开源工具,它可以将来自不同源头的数据收集、转换、过滤,并将其发送到不同的目标。Logstash 是 ELK(Elasticsearch、Logstash 和 Kibana)技术栈的一部分,通常与 Elastics…

实验篇——Ka/Ks分析

实验篇——Ka/Ks分析 文章目录 前言一、名词解释二、实操1. 安装软件2. 准备文件3. 使用ParaAT2.0 KaKs_Calculator2.04. 使用TBtools软件 三、额外总结 前言 鉴定不同基因的复制模式 本文得到的共线性基因对文件 来自于上一篇文章中的LIN.collinearity共线性文件 参考文章&…

设计模式(3)抽象工厂模式

一、概述: 1、提供一个创建一系列相关或相互依赖对象的接口,而无须指定它们具体的类。 2、结构图: 3、举例代码: (1) 实体: public interface IUser {public void insert(User user);public…

C++--动态规划两个数组的dp问题

1.最长公共子序列 力扣(LeetCode)官网 - 全球极客挚爱的技术成长平台 给定两个字符串 text1 和 text2,返回这两个字符串的最长 公共子序列 的长度。如果不存在 公共子序列 ,返回 0 。 一个字符串的 子序列 是指这样一个新的字符串…

Java 实现 国密SM4/ECB/PKCS7Padding对称加密解密

Java 实现 国密SM4/ECB/PKCS7Padding对称加密解密&#xff0c;为了演示方便本问使用的是IntelliJ IDEA 2022.1 (Community Edition)来构建代码的 1、pom.xml文件添加需要的jar <?xml version"1.0" encoding"UTF-8"?> <project xmlns"htt…

分布式事务(4):两阶段提交协议与三阶段提交区别

1 两阶段提交协议 两阶段提交方案应用非常广泛&#xff0c;几乎所有商业OLTP数据库都支持XA协议。但是两阶段提交方案锁定资源时间长&#xff0c;对性能影响很大&#xff0c;基本不适合解决微服务事务问题。 缺点&#xff1a; 如果协调者宕机&#xff0c;参与者没有协调者指…

SpringBoot 01 如何创建 和pom的解析

目录 1 Springboot的创建 步骤 2 项目的书写和运行 创建service包并在其下写一个service文件 项目的运行 pom文件的一些配置 parent web test 打包 打包过程 1 Springboot的创建 步骤 首先new一个新项目 然后依照如下创建 2 项目的书写和运行 创建service包并…

python接口自动化测试框架2.0,让你像Postman一样编写测试用例,支持多环境切换、多业务依赖、数据库断言等

项目介绍 接口自动化测试项目2.0 软件架构 本框架主要是基于 Python unittest ddt HTMLTestRunner log excel mysql 企业微信通知 Jenkins 实现的接口自动化框架。 前言 公司突然要求你做自动化&#xff0c;但是没有代码基础不知道怎么做&#xff1f;或者有自动化…

nginx基于端口如何配置虚拟主机

在 Nginx 中配置基于端口的虚拟主机&#xff08;也称为服务器块&#xff09;与配置基于域名的虚拟主机类似&#xff0c;但是你需要指定监听的端口。以下是基于端口的虚拟主机配置示例&#xff1a; 假设我们要配置两个不同的虚拟主机&#xff0c;一个监听 8080 端口&#xff0c…

vcomp140.dll丢失的修复方法分享,电脑提示vcomp140.dll丢失修复方法

今天&#xff0c;我的电脑出现了一个奇怪的问题&#xff0c;打开某些程序时总是提示“找不到vcomp140.dll文件”。这个问题让我非常头疼&#xff0c;因为我无法正常使用电脑上的一些重要软件。为了解决这个问题&#xff0c;我在网上查找了很多资料&#xff0c;并尝试了多种方法…

亮点!视频云存储/安防监控视频智能分析平台高空抛物AI智能检测

一、行业现状 近年来&#xff0c;高空抛物不文明事件频频发生&#xff0c;成为小区住宅的管理通病&#xff0c;也给居民的人身及财产安全带来了巨大伤害和损失。高空抛物可能导致人身事故等重大经济损失的严重危害&#xff0c;被称作“悬在城市上空的痛”。 TSINGSEE青犀AI智…

算法练习- 其他算法练习5

文章目录 宜居星球改造计划 宜居星球改造计划 yes no na 每个值为一个格子&#xff1b;每天yes的值可以向上下左右扩展一个格子&#xff0c;将no改为yes&#xff1b;矩形区域no是否可以全部转为yes&#xff0c;可以的话需要几天&#xff1f;不可以的话输出-1输入&#xff1a; …

基于FPGA的FIR低通滤波器实现(附工程源码),matlab+vivado19.2+simulation

基于FPGA的FIR低通滤波器实现(附工程源码) 文章目录 基于FPGA的FIR低通滤波器实现(附工程源码)前言一、matlab设计FIR滤波器&#xff0c;生成正弦波1.设计FIR滤波器1.生成正弦波.coe 二、vivado1.fir滤波器IP核2.正弦波生成IP核3.时钟IP核设置4.顶层文件/测试文件代码 三.simul…

Linux共享库基础及实例

共享库是将库函数打包成一个可执行文件&#xff0c;使得其在运行时可以被多个进程共享。 目标库 回顾下构建程序的一种方式&#xff1a; 将每个源文件编译成目标文件&#xff0c;再通过链接器将这些目标文件链接组成一个可执行程序。 gcc -g -c prog.c mod1.c mod2.c gcc -g …

2023国赛数学建模思路 - 案例:粒子群算法

文章目录 1 什么是粒子群算法&#xff1f;2 举个例子3 还是一个例子算法流程算法实现建模资料 # 0 赛题思路 &#xff08;赛题出来以后第一时间在CSDN分享&#xff09; https://blog.csdn.net/dc_sinor?typeblog 1 什么是粒子群算法&#xff1f; 粒子群算法&#xff08;Pa…