微信小程序 onLoad 函数

简介: 小程序注册完成后,加载页面,触发onLoad方法。页面载入后触发onShow方法,显示页面。首次显示页面,会触发onReady方法,渲染页面元素和样式,一个页面只会调用一次。当小程序后台运行或跳转到其他页面时,触发onHide方法。
  1. 小程序注册完成后,加载页面,触发onLoad方法。

  2. 页面载入后触发onShow方法,显示页面。

  3. 首次显示页面,会触发onReady方法,渲染页面元素和样式,一个页面只会调用一次。

  4. 当小程序后台运行或跳转到其他页面时,触发onHide方法。

  5. 当小程序有后台进入到前台运行或重新进入页面时,触发onShow方法。

  6. 当使用重定向方法wx.redirectTo(OBJECT)或关闭当前页返回上一页wx.navigateBack(),触发onUnload

  例如:

  我们定义了一个方法:

  功能是:当用户打开这个页面就会调用下面这个函数

 1   /**
 2    * 获取商品详情信息
 3    */
 4   getdata: function (product_id) {//定义函数名称
 5     var that = this;
 6     wx.request({
 7       url: url,//请求地址
 8       header: {//请求头
 9         "Content-Type": "applciation/json"
10       },
11       method: "GET",//get为默认方法/POST
12       success: function (res) {
15         that.setData ({
16           data: res.data
23       },
24       fail: function (err) { },//请求失败
25       complete: function () { }//请求完成后执行的函数
26     })
27   },

  然后,onLoad调用这个函数

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {this.getdata(options.id);
  },

这样就可以了。

你也可以关注我的微信公众号 lovephp , 一起交流学习 。

目录
相关文章
|
6月前
|
JavaScript 小程序
微信小程序 wxml 中使用 js函数
微信小程序 wxml 中使用 js函数
591 0
|
20天前
|
缓存 小程序 UED
如何利用小程序的生命周期函数实现数据的加载和更新?
如何利用小程序的生命周期函数实现数据的加载和更新?
49 4
|
20天前
|
小程序 UED 开发者
小程序的生命周期函数
小程序的生命周期函数
43 1
|
4月前
|
算法 安全 数据安全/隐私保护
支付系统---微信支付09------数字签名,现在Bob想要给Pink写一封信,信件的内容不需要加密,怎样能够保证信息的完整性,使用信息完整性的主要手段是摘要算法,散列函数,哈希函数,H称为数据指纹
支付系统---微信支付09------数字签名,现在Bob想要给Pink写一封信,信件的内容不需要加密,怎样能够保证信息的完整性,使用信息完整性的主要手段是摘要算法,散列函数,哈希函数,H称为数据指纹
|
4月前
|
小程序
【微信小程序-原生开发】wxml 支持 includes (wxml中执行函数的方法)
【微信小程序-原生开发】wxml 支持 includes (wxml中执行函数的方法)
251 0
|
4月前
|
小程序 C++
【微信小程序-原生开发】实用教程19 - 表单范例 VS 表单校验(含必填校验函数封装,实时数字校验)
【微信小程序-原生开发】实用教程19 - 表单范例 VS 表单校验(含必填校验函数封装,实时数字校验)
68 0
|
4月前
|
小程序 JavaScript
【微信小程序-原生开发】实用教程11 - 用户登录鉴权(含云函数的创建、删除、使用,通过云函数获取用户的openid)
【微信小程序-原生开发】实用教程11 - 用户登录鉴权(含云函数的创建、删除、使用,通过云函数获取用户的openid)
69 0
|
4月前
|
小程序 JavaScript 前端开发
【微信小程序-原生开发】实用教程06-轮播图、分类页签 tab 、成员列表(含Tdesign升级,切换调试基础库,设置全局样式,配置组件按需注入,添加图片素材,wx:for,生命周期 onLoad)
【微信小程序-原生开发】实用教程06-轮播图、分类页签 tab 、成员列表(含Tdesign升级,切换调试基础库,设置全局样式,配置组件按需注入,添加图片素材,wx:for,生命周期 onLoad)
116 0
|
4月前
|
JavaScript 小程序 前端开发
【微信小程序-原生开发】实用教程04-启动/欢迎/首屏广告页(含倒计时、添加文字、rpx、定义变量和函数、读取变量、修改变量、wx.reLaunch 页面跳转、生命周期 onReady等)
【微信小程序-原生开发】实用教程04-启动/欢迎/首屏广告页(含倒计时、添加文字、rpx、定义变量和函数、读取变量、修改变量、wx.reLaunch 页面跳转、生命周期 onReady等)
124 0
|
6月前
|
小程序 数据库
小程序云函数从云数据下载excal
该教程介绍了如何使用小程序云函数从云数据下载Excel文件。首先,创建名为`getexcal`的云函数,然后在终端中安装`node-xlsx`依赖。接着,编写云函数代码,从数据库中获取数据,利用`node-xlsx`生成Excel文件并上传至云端。在页面(index)中,提供下载和打开Excel的按钮。当点击“生成excel”时,调用云函数并获取文件下载地址,将其复制到剪贴板并弹出提示。最后,提醒注意每次更新云函数后需重新部署,并确保使用正确的云开发环境ID。
76 1