博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
小程序学习笔记(1)
阅读量:6445 次
发布时间:2019-06-23

本文共 3111 字,大约阅读时间需要 10 分钟。

1. 注册小程序

----------用App() 函数来注册一个小程序。接受一个 Object 参数,其指定小程序的生命周期回调等。它必须在 app.js 中调用,必须调用且只能调用一次。不然会出现无法预期的后果。
前台、后台定义: 当用户点击左上角关闭,或者按了设备 Home
键离开微信,小程序并没有直接销毁,而是进入了后台;当再次进入微信或再次打开小程序,又会从后台进入前台。需要注意的是:只有当小程序进入后台一定时间,或者系统资源占用过高,才会被真正的销毁。
App({  onLaunch: function(options) {    // 小程序初始化完成时(全局只触发一次)    options包含小程序的初始path,query,scene(场景值),shareTicket,referrerInfo.appId,referrerInfo.extraData(scene=1037或1038时支持)  },  onShow: function(options) {    // Do something when show.小程序启动,或从后台进入前台显示时    参数与onLaunch一致  },  onHide: function() {    // Do something when hide.小程序从前台进入后台时  },  onError: function(msg) {    console.log(msg)    //小程序发生脚本错误,或者 api 调用失败时触发,会带上错误信息  },onPageNotFound:function(){    //页面不存在监听函数, 小程序要打开的页面不存在时触发,会带上页面信息回调该函数    不存在页面的path,打开不存在页面的query,是否是本次启动的首个页面isEntryPage}> 开发者可以在 onPageNotFound 回调中进行重定向处理,但必须在回调中同步处理,异步处理(例如 setTimeout> 异步执行)无效App({  onPageNotFound(res) {    wx.redirectTo({      url: 'pages/...'    }) // 如果是 tabbar 页面,请使用 wx.switchTab  }})> 如果开发者没有添加 onPageNotFound 监听,当跳转页面不存在时,将推入微信客户端原生的页面不存在提示页面。如果 onPageNotFound 回调中又重定向到另一个不存在的页面,将推入微信客户端原生的页面不存在提示页面,并且不再回调 onPageNotFound。  globalData: 'I am global data'})

2. 注册页面

Page(Object) 函数用来注册一个页面。接受一个 Object 类型参数,其指定页面的初始数据、生命周期回调、事件处理函数等。

生命周期:

Page({  data: {    text: "This is page data."  },  onLoad: function(options) {    // Do some initialize when page load.监听页面加载    options中有打开当前页面路径中的参数  },  onReady: function() {    // Do something when page ready.监听页面显示  },  onShow: function() {    // Do something when page show.监听页面初次渲染完成,代表页面已经准备妥当,可以和视图层进行交互  },  onHide: function() {    // Do something when page hide.监听页面隐藏,如 navigateTo 或底部 tab 切换到其他页面,小程序切入后台  },  onUnload: function() {    // Do something when page close.监听页面卸载,如redirectTo或navigateBack到其他页面时。  }})

页面事件处理函数:

  • onPullDownRefres
    监听用户下拉刷新事件。
需要在app.json的window选项中或页面配置中开启enablePullDownRefresh。
可以通过wx.startPullDownRefresh触发下拉刷新,调用后触发下拉刷新动画,效果与用户手动下拉刷新一致。
当处理完数据刷新后,wx.stopPullDownRefresh可以停止当前页面的下拉刷新。
  • onReachBottom()
    监听用户上拉触底事件。
可以在app.json的window选项中或页面配置中设置触发距离onReachBottomDistance。
在触发距离内滑动期间,本事件只会被触发一次。
  • onShareAppMessage:

    监听用户点击页面内转发按钮(<button> 组件 open-type="share")或右上角菜单“转发”按钮的行为,并自定义转发内容

    object参数说明:

    from:为button时,代表页面内转发按钮,为menu时表右上角转发   target:如果 from 值是 button,则 target 是触发这次转发事件的 button,否则为 undefined   webViewUrl:页面中包含
    组件时,返回当前
    的url
注意:只有定义了此事件处理函数,右上角菜单才会显示“转发”按钮
此事件需要 return 一个 Object,用于自定义转发内容,返回内容如下:    转发标题title:当前小程序名称    转发路径path:转发路径    imageUrl:自定义图片路径

},

  • onPageScroll
    option中有scrollTop,即页面在垂直方向已滚动的距离(单位px)
  • onTabItemTap
    当前是 tab 页时,点击 tab 时触发
    console.log(item.index)
    console.log(item.pagePath)
    console.log(item.text)
  • 自定义组件处理事件

    viewTap: function() {
    this.setData({

    text: 'Set some data for updating view.'

    }, function() {

    // this is setData callback

    })

    }

3. 路由

  • getCurrentPages()

图片描述

  • getCurrentPages()
    用于获取当前页面栈的实例,以数组形式按栈的顺序给出,第一个元素为首页,最后一个元素为当前页面。
不要尝试修改页面栈,会导致路由以及页面状态错误。
不要在 App.onLaunch 的时候调用 getCurrentPages(),此时 page 还没有生成。

页面栈

navigateTo, redirectTo 只能打开非 tabBar 页面。
switchTab 只能打开 tabBar 页面。
reLaunch 可以打开任意页面。
页面底部的 tabBar 由页面决定,即只要是定义为 tabBar 的页面,底部都有 tabBar。
调用页面路由带的参数可以在目标页面的onLoad中获取。

Tab切换

转载地址:http://ikvwo.baihongyu.com/

你可能感兴趣的文章
EasyUI - DataGrid 去右边空白滚动条列
查看>>
nodeJs学习过程之一个图片上传显示的例子
查看>>
点击按钮显示谷歌地图
查看>>
bottle-session 0.3 : Python Package Index
查看>>
Android事件机制之一:事件传递和消费
查看>>
Python 2.7 中使用 Print 方法
查看>>
storm进程正常运行一段时间shut down,运维方式
查看>>
程序员的人性思考(下)
查看>>
2014-3-16 星期天 晴[改变生活规律,稳中求进]
查看>>
高效能程序员的七个习惯
查看>>
Ajax
查看>>
Spring3 MVC请求参数获取的几种方法
查看>>
[物理学与PDEs]第2章习题1 无旋时的 Euler 方程
查看>>
快速复习正则表达式
查看>>
jquery 与其他库冲突解决方案
查看>>
ny82 迷宫寻宝(一) map+queue
查看>>
【转】使用genstring和NSLocalizedString实现App文本的本地化
查看>>
[51单片机] EEPROM 24c02 [读取存储多字节]
查看>>
cocos2d-x项目101次相遇:使用触摸事件移动 精灵
查看>>
[再寄小读者之数学篇](2014-05-29 单调函数的一个充分条件)
查看>>