前端面试题---小程序跟vue的声明周期的区别

1. 小程序生命周期

小程序的生命周期主要分为 页面生命周期 和 应用生命周期。每个页面和应用都有自己独立的生命周期函数。

应用生命周期
小程序的应用生命周期函数与全局应用相关,通常包括以下几个钩子:

  • onLaunch(options):应用初始化时触发。这个函数在应用生命周期内只会调用一次。

  • onShow(options):当应用从后台进入前台时触发,比如用户打开小程序时,或者从其他页面返回时。

  • onHide():当应用进入后台时触发,比如用户退出小程序或者切换到其他应用时。

  • onError(error):当发生错误时触发,用来捕获小程序运行过程中的错误。
    页面生命周期
    小程序的页面生命周期函数与每个页面相关,通常包括以下几个钩子:

  • onLoad(options):页面加载时触发。可以获取页面传递的参数(通过 options)。

  • onShow():页面展示时触发。每次页面展示时都会触发,比如切换到这个页面时。

  • onReady():页面初次渲染完成时触发,通常是在页面首次渲染之后调用一次。

  • onHide():页面隐藏时触发,通常在切换到其他页面时触发。

  • onUnload():页面卸载时触发,页面销毁时调用,通常用于清理工作。

  • onPullDownRefresh():下拉刷新时触发。

  • onReachBottom():页面触底时触发。

  • onShareAppMessage():用户点击右上角转发时触发。

2. Vue生命周期

  • 创建阶段
    beforeCreate:组件实例被创建之后,数据观测和事件/侦听器的设置之前触发。
    created:组件实例创建完毕,数据观测和事件/侦听器已设置,但 DOM 尚未挂载。

  • 挂载阶段
    beforeMount:组件挂载前,模板已被编译,DOM 还未渲染。
    mounted:组件挂载到 DOM 上后调用,此时组件的 DOM 已经存在。

  • 更新阶段
    beforeUpdate:数据更新之前调用,此时数据改变,但 DOM 尚未重新渲染。
    updated:数据更新后,DOM 重新渲染后触发。

  • 销毁阶段
    beforeDestroy:组件销毁之前调用,通常用于清理工作。
    destroyed:组件销毁之后调用。

3 主要区别

在这里插入图片描述

4. 具体差异分析

  • 生命周期管理:
    小程序的生命周期相对简单,只有页面和应用两级生命周期。每个页面和应用都在独立的生命周期下运行,而 Vue 更加专注于组件化的生命周期,允许开发者精细控制组件的创建、更新、销毁等过程。

  • 更新机制:
    小程序通过 setData() 来更新数据和视图。视图更新是通过数据的变化来触发的,但这与 Vue 的响应式系统不同,Vue 会自动跟踪数据变化并进行视图更新。

  • 钩子函数:
    Vue 提供了更多的生命周期钩子函数,可以更精细地控制组件的不同阶段。小程序则更注重页面级别的控制,比如通过 onLoad、onShow、onHide 等钩子来管理页面的状态和生命周期。

5. 结论

小程序 的生命周期函数较为简单,适合处理应用和页面级的生命周期,适用于以页面为中心的开发模型。
Vue 则是基于组件化思想,提供了更为细粒度的生命周期钩子,适用于开发单页应用(SPA)等现代前端应用,能够更加灵活地管理组件的状态和行为。

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

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

相关文章

【芯片设计】NPU芯片前端设计工程师面试记录·20250227

应聘公司 某NPU/CPU方向芯片设计公司。 小声吐槽两句,前面我问了hr需不需要带简历,hr不用公司给打好了,然后我就没带空手去的。结果hr小姐姐去开会了,手机静音( Ĭ ^ Ĭ )面试官、我、另外的hr小姐姐都联系不上,结果就变成了两个面试官和我一共三个人在会议室里一人拿出…

让Word插上AI的翅膀:如何把DeepSeek装进Word

在日常办公中,微软的Word无疑是我们最常用的文字处理工具。无论是撰写报告、编辑文档,还是整理笔记,Word都能胜任。然而,随着AI技术的飞速发展,尤其是DeepSeek的出现,我们的文字编辑方式正在发生革命性的变…

点击修改按钮图片显示有问题

问题可能出在表单数据的初始化上。在 ave-form.vue 中,我们需要处理一下从后端返回的图片数据,因为它们可能是 JSON 字符串格式。 vue:src/views/tools/fake-strategy/components/ave-form.vue// ... existing code ...Watch(value)watchValue(v: any) …

vue深拷贝:1、使用JSON.parse()和JSON.stringify();2、使用Lodash库;3、使用深拷贝函数(采用递归的方式)

文章目录 引言三种方法的优缺点在Vue中,实现数组的深拷贝I JSON.stringify和 JSON.parse的小技巧深拷贝步骤缺点:案例1:向后端请求路由数据案例2: 表单数据处理时复制用户输入的数据II 使用Lodash库步骤适用于复杂数据结构和需要处理循环引用的场景III 自定义的深拷贝函数(…

线性模型 - 支持向量机

支持向量机(SVM)是一种用于分类(和回归)的监督学习算法,其主要目标是找到一个最佳决策超平面,将数据点分为不同的类别,并且使得分类边界与最近的数据点之间的间隔(margin&#xff09…

记录一次解决springboot需要重新启动项目才能在前端界面展示静态资源的问题--------使用热部署解决

问题 使用sprinbootthymeleaf&#xff0c;前后端不分离&#xff0c;一个功能是用户可以上传图片&#xff0c;之后可以在网页展示。用户上传的图片能在对应的静态资源目录中找到&#xff0c;但是在target目录没有&#xff0c;导致无法显示在前端界面 解决 配置热部署 <depe…

【Python pro】函数

1、函数的定义及调用 1.1 为什么需要函数 提高代码复用性——封装将复杂问题分而治之——模块化利于代码的维护和管理 1.1.1 顺序式 n 5 res 1 for i in range(1, n1):res * i print(res) # 输出&#xff1a;1201.1.2 抽象成函数 def factorial(n):res 1for i in range(1…

[Web 信息收集] Web 信息收集 — 手动收集 IP 信息

关注这个专栏的其他相关笔记&#xff1a;[Web 安全] Web 安全攻防 - 学习手册-CSDN博客 0x01&#xff1a;通过 DNS 服务获取域名对应 IP DNS 即域名系统&#xff0c;用于将域名与 IP 地址相互映射&#xff0c;方便用户访问互联网。对于域名到 IP 的转换过程则可以参考下面这篇…

大语言模型的评测

大语言模型评测是评估这些模型在各种任务和场景下的性能和能力的过程。 能力 1. 基准测试&#xff08;Benchmarking&#xff09; GLUE&#xff08;General Language Understanding Evaluation&#xff09;&#xff1a;包含多个自然语言处理任务&#xff0c;如文本分类、情感分…

Node.js与MySQL的深入探讨

Node.js与MySQL的深入探讨 引言 Node.js,一个基于Chrome V8引擎的JavaScript运行时环境,以其非阻塞、事件驱动的方式在服务器端应用中占据了一席之地。MySQL,作为一款广泛使用的开源关系型数据库管理系统,凭借其稳定性和高效性,成为了许多应用的数据库选择。本文将深入探…

STM32--SPI通信讲解

前言 嘿&#xff0c;小伙伴们&#xff01;今天咱们来聊聊STM32的SPI通信。SPI&#xff08;Serial Peripheral Interface&#xff09;是一种超常用的串行通信协议&#xff0c;特别适合微控制器和各种外设&#xff08;比如传感器、存储器、显示屏&#xff09;之间的通信。如果你…

基于定制开发开源AI大模型S2B2C商城小程序的商品选品策略研究

摘要&#xff1a;随着电子商务的蓬勃发展和技术的不断进步&#xff0c;商品选品在电商领域中的重要性日益凸显。特别是在定制开发开源AI大模型S2B2C商城小程序的环境下&#xff0c;如何精准、高效地选择推广商品&#xff0c;成为商家面临的一大挑战。本文首先分析了商品选品的基…

C#异步编程之async与await

一&#xff1a;需求起因 在 C# 中使用异步编程&#xff08;特别是使用 async 和 await 关键字&#xff09;通常是为了提高应用程序的响应性和性能&#xff0c;特别是在需要进行 I/O 操作或执行长时间运行的任务时。 常见应用场景如下&#xff1a; 1. 网络请求 HTTP 请求&…

PMP项目管理—整合管理篇—7.结束项目或阶段

文章目录 基本信息过程4W1HITTO输入工具与技术输出 收尾过程组项目收尾&#xff08;结束项目或阶段&#xff09;行政收尾/管理收尾 合同收尾&#xff08;结束采购&#xff09; 最终报告 基本信息 项目无论何因何时终止&#xff0c;都必须用结束项目或阶段过程来正式关闭。通过…

labview中VISA串口出现异常的解决方案

前两天在做项目时发现&#xff0c;当用VISA串口读取指令时出现了回复异常的情况&#xff0c;不管发什么东西就一直乱回&#xff0c;针对这个情况&#xff0c;后面在VISA串口中加了一个VISA寄存器清零的函数。加了之后果然好多了&#xff0c;不会出现乱回的情况&#xff0c;但是…

【GO】学习笔记

目录 学习链接 开发环境 开发工具 GVM - GO多版本部署 GOPATH 与 go.mod go常用命令 环境初始化 编译与运行 GDB -- GNU 调试器 基本语法与字符类型 关键字与标识符 格式化占位符 基本语法 初始值&零值&默认值 变量声明与赋值 _ 下划线的用法 字…

staruml绘制时序图和用例图

文章目录 1.文章介绍2.绘制用例图3.绘制时序图 1.文章介绍 之前&#xff0c;我们初步介绍了这个staruml软件的安装和如何使用这个软件对于uml类图进行绘制&#xff0c;当时我们是绘制了这个user类&#xff0c;实现了相关的接口&#xff0c;表示他们之间的关系&#xff0c;在今…

开放标准(RFC 7519):JSON Web Token (JWT)

开放标准&#xff1a;JSON Web Token 前言基本使用整合Shiro登录自定义JWT认证过滤器配置Config自定义凭证匹配规则接口验证权限控制禁用session缓存的使用登录退出单用户登录Token刷新双Token方案单Token方案 前言 JSON Web Token &#xff08;JWT&#xff09; 是一种开放标准…

使用 Polars 进行人工智能医疗数据分析(ICU数据基本测试篇)

引言 在医疗领域&#xff0c;数据就是生命的密码&#xff0c;每一个数据点都可能蕴含着拯救生命的关键信息。特别是在 ICU 这样的重症监护场景中&#xff0c;医生需要实时、准确地了解患者的病情变化&#xff0c;以便做出及时有效的治疗决策。而随着医疗技术的飞速发展&#x…

瑞芯微RK安卓Android主板GPIO按键配置方法,触觉智能嵌入式开发

触觉智能分享&#xff0c;瑞芯微RK安卓Android主板GPIO按键配置方法&#xff0c;方便大家更好利用空闲IO&#xff01;由触觉智能Purple Pi OH鸿蒙开发板演示&#xff0c;搭载了瑞芯微RK3566四核处理器&#xff0c;树莓派卡片电脑设计&#xff0c;支持安卓Android、开源鸿蒙Open…