导航

菜单栏目

勤劳的少侠

创作中心 订单管理,0+ 0+
大侠，快点这里。
快捷工具 Messages Bookmark Cart Privacy Upgrade More Features
0+ 0+
大侠，点这里登陆。
当前位置:首页 > 公众号小程序 > 小程序 > 内容列表

微信小程序的启动流程分析,

次查看
作者图片
加载中。。。 更新于2018-10-18 20:10:47
订阅此少侠 loading

所属栏目:

  • 小程序

详细内容

  我们在学习微信小程序开发时，非常有必要了解微信小程序的启动流程，因为，只有把小程序的启动流程掌握了，才能在做微信小程序开发时更容易的开发小程序。

  小程序刚出来的时候就感觉非常有前途，我们就拿一个网站来说吧，当你在手机上面打开一个网站时，你需要输入网址，我们知道手机上面的“小键盘”需要我们用手打字，但是，我们的手都很粗，非常不方便。

  而网站又是一个企业的必备，现在有了app了，一般的企业的app也是企业的必备产品，app一般也要下载，不仅下载占用我们的手机空间，而且，还要花钱浪费流量，而小程序完全没有这两种产品的缺点。

  微信小程序只要一扫就可以打开，如果让你去了解一个企业，你愿意下载一个app还是输入一个网址了解企业，还是你扫一下微信小程序就了解一个企业？很显示小程序是最方便的，这也是为什么在网上招聘微信小程序开发工程师那么多的原因，而且，越来越多的企业在招聘微信小程序工程师。

  在我们开发微信小程序时，了解掌握微信小程序的启动流程是非常有必要的，后面我们将在本教程中举一个例子，讲解一下为什么了解小程序的启动是非常有必要的。

小程序的启动流程

  1）下载小程序代码包到本地。

  微信客户端在打开小程序前，会先把小程序代码包下载到本地。

  这就是为什么我们扫描完小程序后要稍微等上几秒钟的时间才能打开小程序，这几秒钟的时间是微信客户端正在下载小程序代码包到本地的原因。

  从这里我们可以知道：在做微信小程序开发时一定要精减代码，优化代码，把小程序代码优化到最精简，这样小程序的打开速度会更快，这也是为什么我会分析一个小程序启动流程的原因，因为，只有把这一流程分析的透彻了，我们在开发微信小程序时，才能做到用最少的代码实现最多的功能。

  2）加载小程序首页。

  当下载完微信小程序代码包以后，就接着搜索代码包中的app.json，加载这里面的pages字段后面的第一个页面，即加载微信小程序的首页。

  假设app.json代码如下：

{
  "pages":[
    "pages/index/index",
    "pages/logs/logs"
  ]
}

  其中，页面pages/index/index就是小程序的首页路径，这一步微信客户端就会把在目录为pages（注意此pages与字段pages是不同的，具体请看教程“.json文件中的pages和小程序路径”）下面的目录index里面的页面，名称为index的页面代码加载进来。

  一个正常的小程序页（以这里面的小程序首页页面为例子）面文件包括：index.json，index.wxml，index.wxss，index.js

  3）加载app.js文件。

  当小程序完成上面两个步骤后，到这一步微信小程序启动已经完成了，小程序启动完成以后，接下来微信客户端就会加载小程序根目录里面的文件app.js定义的 App 实例的 onLaunch 回调会被执行:

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

  这个回调函数onLaunch是非常有用的，就是我们通过手机扫一扫小程序二维码以后，就紧接着装载小程序代码包，启动后就触发这个回调函数onLaunch，我们可以在这个函数里面做很多的事情。

  例如，微信小程序打开后，弹出一个对话框，或是到了企业搞活动的季节，别人打开小程序后就出来一个做优惠活动的信息，这是非常有用的。

实验测试

  假设加载完小程序以后，我们让他出来一段话（这里为了测试方便，可以是文字，也可以图文等）这段话是：这个网站www.phpos.net是学习微信小程序开发的好地方！

 
  如下图所示：



  这是我在微信开发工具中的测试，效果正如上面我们所解释的一样。

相关标签:

网站建设


热门推荐


相关内容

闲过信陵饮，脱剑膝前横。 将炙啖朱亥，持觞劝侯嬴。三杯吐然诺，五岳倒为轻。 眼花耳热后，意气素霓生。 __联系：刘先生，18855433808 QQ：8457726