小程序

小程序官方开发文档学习(二)-- 逻辑层

2017-02-14  本文已影响216人  寒桥
小程序开发框架的逻辑层(App Service)是由JavaScript编写。逻辑层将数据进行处理后发送给视图层,同时接受视图层的事件反馈。

注册程序
注册页面
模块化

注册程序

object参数说明.png

注册页面

object参数说明.png
示例代码
<view>{{text}}</view>
<view>{{array[0].msg}}</view>
Page({
  data: {
    text: 'init data',
    array: [{msg: '1'}, {msg: '2'}]
  }
})
onLoad: 页面加载 (1)一个页面只会调用一次。(2)接收页面参数可以获取wx.navigateTowx.redirectTo<navigator/>中的 query。
onShow: 页面显示 (1)每次打开页面都会调用一次。
onReady: 页面初次渲染完成 (1)一个页面只会调用一次,代表页面已经准备妥当,可以和视图层进行交互。(2)对界面的设置如wx.setNavigationBarTitle请在onReady之后设置。
onHide: 页面隐藏 (1)当navigateTo或底部tab切换时调用。
onUnload: 页面卸载 (1)当redirectTo或navigateBack的时候调用。
onPullDownRefresh: 下拉刷新(1)监听用户下拉刷新事件。(2)需要在config的window选项中开启enablePullDownRefresh。(3)当处理完数据刷新后,wx.stopPullDownRefresh可以停止当前页面的下拉刷新。
onShareAppMessage: 用户分享 (1)只有定义了此事件处理函数,右上角菜单才会显示“分享”按钮。(2)用户点击分享按钮的时候会调用。(3)此事件需要 return 一个 Object,用于自定义分享内容
自定义分享字段.png
注意:
    (1)直接修改 this.data 无效,无法改变页面的状态,还会造成数据不一致。
    (2)单次设置的数据不能超过1024kB,请尽量避免一次设置过多的数据。
页面栈表现.png page实例生命周期.png 页面的路由.png

Tab 切换对应的生命周期(以 A、B 页面为 Tabbar 页面,C 是从 A 页面打开的页面,D 页面是从 C 页面打开的页面为例):

Tab对应的生命周期.png

模块化

需要注意的是
    exports 是 module.exports 的一个引用,因此在模块里边随意更改 exports 的指向会造成未知的错误。所以更推荐开发者采用 module.exports 来暴露模块接口,除非你已经清晰知道这两者的关系。
    小程序目前不支持直接引入 node_modules , 开发者需要使用到 node_modules 时候建议拷贝出相关的代码到小程序的目录中。

​在需要使用这些模块的文件中,使用 require(path) 将公共代码引入
如:var common = require('common.js')
上一篇 下一篇

猜你喜欢

热点阅读