对于小程序中的每个页面,都需要在页面对应的 js
文件中进行注册,指定页面的初始数据、生命周期回调、事件处理函数等。
使用 Page 构造器注册页面
简单的页面可以使用 Page()
进行构造。
代码示例:
//index.js Page({
d
ata: { text: "This is page data." },
onLoad: function(options) { // 页面创建时执行 },
onShow: function() { // 页面出现在前台时执行 },
onReady: function() { // 页面首次渲染完毕时执行 },
onHide: function() { // 页面从前台变为后台时执行 },
onUnload: function() { // 页面销毁时执行 },
onPullDownRefresh: function() { // 触发下拉刷新时执行 },
onReachBottom: function() { // 页面触底时执行 },
onShareAppMessage: function () { // 页面被用户分享时执行 },
onPageScroll: function() { // 页面滚动时执行 },
onResize: function() { // 页面尺寸变化时执行 },
onTabItemTap(item) { // 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 }) }, // 自由数据
customData: { hi: 'MINA' } })
详细的参数含义和使用请参考 Page 参考文档 。
在页面中使用 behaviors
基础库 2.9.2 开始支持,低版本需做兼容处理。
页面可以引用 behaviors 。 behaviors 可以用来让多个页面有相同的数据字段和方法。
// my-behavior.js module.exports = Behavior({
da
ta: { sharedText: 'This is a piece of data shared between pages.' }, methods: {
sharedMethod: function() {
this.data.sharedText === 'This is a piece of data shared between pages.' } } })
// page-a.js var myBehavior = require('./my-behavior.js')
Page({
behaviors: [myBehavior],
onLoad: function() {
this.data.sharedText === 'This is a piece of data shared between pages.' } })
具体用法参见 behaviors 。
使用 Component 构造器构造页面
基础库 1.6.3 开始支持,低版本需做兼容处理。
Page
构造器适用于简单的页面。但对于复杂的页面,
Page
构造器可能并不好用。
此时,可以使用
Component
构造器来构造页面。
Component
构造器的主要区别是:方法需要放在
methods: { }
里面。
代码示例:
Component({
da
ta: { text: "This is page data." },
methods: { onLoad: function(options) { // 页面创建时执行 },
onPullDownRefresh: function() { // 下拉刷新时执行 }, // 事件响应函数
viewTap: function() { // ... } } })
这种创建方式非常类似于 自定义组件 ,可以像自定义组件一样使用 behaviors
等高级特性。
具体细节请阅读 【说明】:本文章由站长整理发布,文章内容不代表本站观点,如文中有侵权行为,请与本站客服联系(QQ:254677821)!