微信小程序生命周期、页面生命周期、组件生命周期
1. 生命周期 App(全局)
位置:项目根目录app.js文件
App({
onLaunch (options) {
//
console.log('小程序初始化')
},
onShow(options) {
console.log('监听小程序启动或切前台')
},
onHide() {
console.log('监听小程序切后台')
},
onError(msg) {
console.log('错误监听函数')
},
onPageNotFound(res) {
console.log('小程序要打开的页面不存在时触发');
wx.redirectTo({ // 重定向
url: 'pages/...'
}) // 如果是 tabbar 页面,请使用 wx.switchTab
}
})
2. 页面生命周期
// pages/a.js
Page({
/**
* 页面的初始数据
*/
data: {
},
/*页面生命周期*/
onReady: function () {
console.log('监听页面初次渲染完成')
},
onShow: function () {
console.log('监听页面显示')
},
onHide: function () {
console.log('监听页面隐藏')
},
onUnload: function () {
console.log('监听页面卸载')
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
3. 组件生命周期
// pages/myComponent.js
Component({
/**
* 组件的属性列表
*/
properties: {
},
/**
* 组件的初始数据
*/
data: {
},
/**
* 组件的方法列表
*/
methods: {
},
/*组件生命周期*/
lifetimes: {
created() {
console.log("在组件实例刚刚被创建时执行")
},
attached() {
console.log("在组件实例进入页面节点树时执行")
},
ready() {
console.log("在组件在视图层布局完成后执行")
},
moved() {
console.log("在组件实例被移动到节点树另一个位置时执行")
},
detached() {
console.log("在组件实例被从页面节点树移除时执行")
},
error() {
console.log("每当组件方法抛出错误时执行")
},
/*组件所在页面的生命周期 */
pageLifetimes: {
show: function () {
// 页面被展示
console.log("页面被展示")
},
hide: function () {
// 页面被隐藏
console.log("页面被隐藏")
},
resize: function (size) {
// 页面尺寸变化
console.log("页面尺寸变化")
}
}
}
})
微信小程序生命周期、页面生命周期、组件生命周期的更多相关文章
- Java Web项目,Android和微信小程序的初始页面配置
Java Web项目 我们在Eclipse里开了Java Web项目之后,Run As Tomcat或者Apache服务器,本地运行,如果直接用http://localhost:8080访问项目,会发 ...
- (十二)微信小程序实现登陆页面+登陆逻辑
微信小程序实现登陆页面 实现上面两个页面 第一个页面 <view> <!-- 上侧部分 --> <view class="top-view"> ...
- 完整微信小程序授权登录页面教程
完整微信小程序授权登录页面教程 1.前言 微信官方对getUserInfo接口做了修改,授权窗口无法直接弹出,而取而代之是需要创建一个button,将其open-type属性绑定getUseInfo方 ...
- 微信小程序把玩(十七)input组件
原文:微信小程序把玩(十七)input组件 input输入框使用的频率也是比较高的...样式的话自己外面包裹个view自己定义.input属性也不是很多,有需要自己慢慢测,尝试 主要属性: wxml ...
- 微信小程序把玩(十)swiper组件
原文:微信小程序把玩(十)swiper组件 Android写过轮播图的痛楚只有写过的知道,相对还是比较麻烦的,并没有一个轮播图组件,有个ViewPage也需要自己定制,IOS则多用UIScroller ...
- 微信小程序把玩(十一)icon组件
原文:微信小程序把玩(十一)icon组件 这些是提供的所支持的图标样式,根据需求在此基础上去修改大小和颜色. 主要属性: 使用方式: wxml <!--成功图标--> <icon t ...
- 微信小程序把玩(十三)progress组件
原文:微信小程序把玩(十三)progress组件 进度条描述的是一种加载的状态,比如软件升级下载进度, 视频,图片下载进度- 主要属性: wxml <progress percent=" ...
- 微信小程序把玩(九)scroll-view组件
原文:微信小程序把玩(九)scroll-view组件 scroll-view为滚动视图,分为水平滚动和垂直滚动.注意滚动视图垂直滚动时一定要设置高度否则的话scroll-view不会生效.滚动视图常用 ...
- 微信小程序把玩(八)view组件
原文:微信小程序把玩(八)view组件 刚看到这个效果的时候还真是和ReactNative的效果一致,属性也基本的一样. view这个组件就是一个视图组件使用起来非常简单. 主要属性: flex-di ...
- 微信小程序简单封装图片上传组件
微信小程序简单封装图片上传组件 希望自己 "day day up" -----小陶 我从哪里来 在写小程序的时候需要上传图片,个人觉得官方提供的 Uploader 组件不是太好用, ...
随机推荐
- Skimap_ros 利用RGBD创建Octomap(一)
1. 奥比中光astra RGBD相机安装 1.1 安装依赖 $ sudo apt-get install build-essential freeglut3 freeglut3-dev 1.2 检查 ...
- IDEA compile successfully many errors still occur
Compile and install successfully with maven in IDEA, but error prompt still popup. Your local enviro ...
- phpredis中incr以及decr等自增命令出现的问题
在做项目中使用redis的incr以及hincrby自增时,出现自增失败,set之后的数据,无法自增,当redis中不存在该key时,直接用incr是成功的.查找了原因,是因为phpredis初始化的 ...
- OpenCV常用基本处理函数(2)图像基本操作
可以根据像素的行和列的坐标获取他的像素值.对 BGR 图像而言,返回值为 B,G,R 例如获取蓝色的像素值: img=cv2.imread('messi5.jpg')px=img[100,100]bl ...
- springDataRedis 依赖
<dependencies> <dependency> <groupId>junit</groupId> <artifactId>junit ...
- 第六周-Scrum Meeting
第一部分ScrumMeeting 每个人的工作: 成员 任务 ISSUE链接 本周已完成的工作 本周计划完成的工作 工作中遇到的困难 李卓峻 负责商品信息页面的界面设计与功能实现 https://gi ...
- VC++ 字符串操作学习总结
vc++中各种字符串(转载) http://www.cnblogs.com/tomin/archive/2008/12/28/1364097.html CString ,BSTR ,LPCTSTR之间 ...
- SpringMVC·form表单Date类型问题导致的400问题
问题描述 前端传yyyy-MM-dd hh:mm:ss格式的时间其实是String类型导致JavaBean中的Date类型Setter报错,从而导致api请求400. 问题解决 我的解决方式: 在对应 ...
- cookie的使用说明
cookie的英文意思是饼干的意思,实质上是键值对组成的字典.就是说你访问某一个网址,服务器给你一个东西,你收到东西,并且贴上了一个标签.下次你访问服务器的时候,请求带有标签.这样服务器给你之后,就会 ...
- leetcode上的一些动态规划
70-爬楼梯 思路:该问题可以理解为经典的“斐波那契数列”问题,但这里需要用动规实现,递归会超时 class Solution { public: int climbStairs(int n) { v ...