前端面试真题

news/2024/10/21 0:36:48/

vue

1、说一下你对vue生命周期的理解

组件从创建到销毁的过程就是它的生命周期
beforeCreat:在这个阶段属性和方法都不能使用
created:这里是实例创建完成之后,在这里完成了数据监测,可以使用数据,修改数据,不会触发updated,也不会更新视图
beforeMount:完成了模板的编译,虚拟DOM也完成创建,即将渲染,修改数据,不会触发updated
Mounted:把编译好的模板挂载到页面,这里可以发送异步请求也可以访问DOM节点
beforeUpdate:组件数据更新之前使用,数据是新的,页面上的数据时旧的,组件即将更新,准备渲染,可以改数据
updated:render重新做了渲染,这时数据和页面都是新的,避免在此更新数据
beforeDestroy:实例销毁前,在这里实例还可以用,可以清楚定时器等等
destroyed:组件已经被销毁了,全部都销毁

使用了keep-alive时多出两个周期:
activited:组件激活时
deactivited:组件被销毁时

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

created:在渲染前调用,通常先初始化属性,然后做渲染
mounted:在模板渲染完成后,一般都是初始化页面后,在对元素节点进行操作,在这里请求数据可能会出现闪屏的问题,created里不会
请求的数据对DOM有影响,那么使用created,如果请求的数据对DOM无关,可以放在mounted

3、vue中的修饰符有哪些?

  1. 事件修饰符
    .stop 组织冒泡
    .prevent 组织默认行为
    .capture 内部元素触发的事件先在次处理
    .self 只有在event.target是当前元素时触发
    .once 事件只会触发一次
    .passive 立即触发默认行为
    .native 把当前元素作为原生标签看待
  2. 按键修饰符
    .keyup 键盘抬起
    .keydown 键盘按下
  3. 系统修饰符
    .ctrl
    .alt
    .meta
  4. 鼠标修饰符
    .left 鼠标左键
    .right 鼠标右键
    .middle 鼠标中键
  5. 表单修饰符
    .lazy 等输入完之后再显示
    .trim 删除内容前后的空格
    .number 输入是数字或转为数字

4、vue如何进行组件通信

1.父传子
props
父组件使用自定义属性,然后子组件使用props
r e f 引用信息会注册在父组件的 ref 引用信息会注册在父组件的 ref引用信息会注册在父组件的refs对象上
2.子传父
$emit
子组件绑定自定义事件,触发执行后,传给父组件,父组件需要用事件监听来接收参数
3.兄弟传
new一个新的vue实例,用on和emit来对数据进行传输
4.vuex传值

5、keep-alive是什么?怎么使用?

Vue的一个内置组件,包裹组件的时候,会缓存不活跃的组件实例,并不是销毁他们
作用:把组件切换的状态保存在内存里,防止重复渲染DOM节点,减少加载时间和性能消耗,提高用户体验

6、axios是怎么做封装的?

下载 创建实例 接着封装请求响应拦截器 抛出 最后封装接口

7、vue路由时怎么传参的?

params传参
this. r o u t e r . p u s h ( n a m e : ′ i n d e x ′ , p a r a m s : i d : i t e m . i d ) t h i s . router.push({name:'index',params:{id:item.id}}) this. router.push(name:index,params:id:item.id)this.route.params.id
路由属性传参
this.KaTeX parse error: Expected '}', got 'EOF' at end of input: …({name:'/index/{item.id}‘})
路由配置 { path:’/index:id’ }
query传参(可以解决页面刷新参数丢失的问题)
this.$router.push({
name:‘index’,
query:{id:item.id}
})


http://www.ppmy.cn/news/1442586.html

相关文章

(学习日记)2024.05.05:UCOSIII第五十九节:User文件夹函数概览(uCOS-III->Source文件夹)第五部分

之前的章节都是针对某个或某些知识点进行的专项讲解,重点在功能和代码解释。 回到最初开始学μC/OS-III系统时,当时就定下了一个目标,不仅要读懂,还要读透,改造成更适合中国宝宝体质的使用方式。在学完野火的教程后,经过几经思考,最后决定自己锦上添花,再续上几章。 这…

docker如何查看对外暴露接口

在Docker的世界里,了解如何查看容器对外暴露的接口是管理Docker应用的关键技能之一。暴露接口允许外部世界与容器内部的服务进行通信,是实现服务交互和持续集成/持续部署(CI/CD)管道的基础。本文将深入探讨Docker中暴露接口的机制…

分类神经网络1:VGGNet模型复现

目录 分类网络的常见形式 VGG网络架构 VGG网络部分实现代码 分类网络的常见形式 常见的分类网络通常由特征提取部分和分类部分组成。 特征提取部分实质就是各种神经网络,如VGG、ResNet、DenseNet、MobileNet等。其负责捕获数据的有用信息,一般是通过…

比特币成长的代价

作者:Jeffrey Tucker,作家和总裁。曾就经济、技术、社会哲学和文化等话题广泛发表演讲。编译:秦晋 2017 年之后参与比特币市场的人遇到了与之前的人不同的操作和理想。如今,没有人会太在意之前的事情,说的是 2010-2016…

盲人餐厅点餐:科技之光照亮餐桌上的美食之旅

在现代社会,餐厅不仅是满足口腹之欲的场所,更是一个社交、放松的重要空间。然而,对于视障人士而言,盲人餐厅点餐这一日常行为,却往往伴随着诸多不便与挑战。幸运的是,科技的革新正为这一群体带来前所未有的…

Python小功能实现(链接下载图品并存储到EXCEL中)

import os import requests from openpyxl import Workbook from openpyxl.drawing.image import Image from concurrent.futures import ThreadPoolExecutor# 图片链接列表 image_urls ["https://uploads/file/20230205/f85Lpcv8PXrLAdmNUDE1Hh6xqkp0NHi2gSXeqyOb.png&q…

192.168.100.0被划分为8个网段后子网掩码写多少?

题目:192.168.100.0被划分为8个网段后子网掩码写多少? 众所周知,二进制转十进制的公式:2^n2^n-1...2^0 其实一些比较小数值的运算可以使用以下方式: 解析: 先按照2^n计算结果从大到小排列将现在的十进制数…

UI图中的opacity效果和代码效果不一样

有时UI图中使用了opacity属性,这个和前端代码效果不一致,修改方法: 不要用opacity属性,而是使用background:rgba( )的效果接客。