微信小程序从入门到精通(二):小程序的工作运行流程与启动过程

2024-07-29
来源:网络整理

前言

上一篇博客介绍了小程序的一些基本概念和代码结构以及几种主要的文件类型(微信小程序从入门到精通(一)基础知识与代码结构)。这篇博客会结合官方的简单教程和项目,继续研究小程序的工作原理。

小程序功能

上次我们了解了小程序的代码结构,以及四种重要的文件类型(wxml、wxss、js、app.json),接下来我们先来看一下小程序的整体工作流程,从启动开始。

启动小程序

首先我们来看一下小程序启动时发生了什么,引用官方文档:

小程序启动后,会执行app.js中定义的App实例的回调。

App({ onLaunch: function () { // 小程序启动之后 触发 } })

如上图,这里要提到另外一个文件——app.js。前面我们已经了解过app.json(全局配置,包括页面路径等)和app.wxss(全局样式)。同样,app.js也是一个用来描述公共逻辑代码的文件,是小程序中需要的两个主要配置文件之一(app.json和app.js):

这里我们只需要明确一点,一个小程序的主体必须由三个文件组成,分别是app.js(必需)、app.json(必需)和app.wxss(可选)。明确了这一点之后,我们继续看刚才官方文档中提到的App实例,也就是上面代码中看到的App{()}。这涉及到另外一个重要的概念——注册程序,这属于逻辑层(App)的操作。官方文档中有这么一句话:

添加App和Page方法来注册程序和页面。

如上图,Page 方法我们之前已经见过了,WXML 中的动态数据来自于对应 Page 的数据,用于注册一个页面。Page 我们后面再讲,但是我们要知道 App 和 Page 方法是逻辑层(App)最核心的两个方法。接下来我们先来详细研究一下 App 方法,引用官方文档的概述:

App()函数用于注册一个小程序,接受一个参数,指定小程序的生命周期函数等。

如上图,我们需要关注的是参数,上面提到的回调就是其中一个参数,上面示例代码中的注释说会在小程序启动后触发,那么它会被调用几次呢?我们还是去官方文档找答案吧。我们先来看一下App函数的参数的所有属性:

属性类型描述触发时间

小程序开发程序入门_微信开发小程序基础入门_微信小程序游戏开发

生命周期函数-监听小程序初始化

当小程序初始化的时候会触发(全局只触发一次)

生命周期函数-监控小程序展示

当小程序启动或从后台调到前台时,它将触发

生命周期函数-监控小程序隐藏

当小程序从前台进入后台时,会触发

错误监听函数

当小程序发生脚本错误或者API调用失败时,会触发错误信息

其他

任何

开发人员可以向参数添加任何函数或数据并使用它来访问它们。

如上图,可以看到该函数主要用于小程序的全局初始化,由于只会触发一次,所以类似于开发中设置静态方法。上表中,注意描述栏,这是一个生命周期函数。因此,有必要详细解释一下微信小程序中关于生命周期的一些概念。小程序的生命周期需要分为两个部分,分别是:

应用程序生命周期 页面生命周期

这不同于官方文档中生命周期只针对接口(,),小程序官方文档并没有单独介绍生命周期,而是在注册程序、注册页面两个标题下分别介绍了 App() 函数和 Page() 函数。然后在各个(App, Page)的参数说明中,都简单的按照上表的形式标注了哪些是生命周期函数。关于 Page 以后再说,我们回归正题。App() 显然有 3 个生命周期函数,分别是:

如上所示,除了只执行一次之外,会根据生命周期的变化执行多次。注意触发时机提到了前台和后台的概念。其实很简单。

分享