# Page(Object object)

注册小程序中的一个页面。它接受一个 Object 类型参数，其指定页面的初始数据、生命周期回调、事件处理函数等。

相关高级内容，可参考 组件脚本 。

# 参数

# Object object

# 示例代码

//index.js
Page({
  data: {
    text: "This is page data."
  },
  onLoad: function(options) {
    // Do some initialize when page load.
  },
  onShow: function() {
    // Do something when page show.
  },
  onReady: function() {
    // Do something when page ready.
  },
  onHide: function() {
    // Do something when page hide.
  },
  onUnload: function() {
    // Do something when page close.
  },
  onPullDownRefresh: function() {
    // Do something when pull down.
  },
  onReachBottom: function() {
    // Do something when page reach bottom.
  },
  onShareAppMessage: function () {
    // return custom share data when user share.
  },
  onPageScroll: function() {
    // Do something when page scroll
  },
  onResize: function() {
    // Do something when page resize
  },
  onTabItemTap(item) {
    console.log(item.index)
    console.log(item.pagePath)
    console.log(item.text)
  },
  // Event handler.
  viewTap: function() {
    this.setData({
      text: 'Set some data for updating view.'
    })
  },
  customData: {
    hi: 'MINA'
  }
})

在上例中，data 表示组件的数据，setData 表示对数据的更新。它们与 Component 构造器 中对应的项目一致。

# 生命周期回调函数

生命周期的触发以及页面的路由方式详见 页面路由 。

这些方法可以放在 Page 构造器中，也可以放在 Component 构造器的 methods 导出方法中。

# onLoad(Object query)

页面加载时触发。一个页面只会调用一次，可以在 onLoad 的参数中获取打开当前页面路径中的参数。

参数：

# onShow()

页面显示/切入前台时触发。

# onReady()

页面初次渲染完成时触发。一个页面只会调用一次，代表页面已经准备妥当，可以和视图层进行交互。

注意：对界面内容进行设置的 API 如wx.setNavigationBarTitle，请在onReady之后进行。详见生命周期

# onHide()

页面隐藏/切入后台时触发。 如 wx.navigateTo 或底部 tab 切换到其他页面，小程序切入后台等。

# onUnload()

页面卸载时触发。如wx.redirectTo或wx.navigateBack到其他页面时。

# onRouteDone()

路由动画完成时触发。如 wx.navigateTo 页面完全推入后 或 wx.navigateBack 页面完全恢复时。

# 页面事件处理函数

# onPullDownRefresh()

监听用户下拉刷新事件。

• 需要在app.json的window选项中或页面配置中开启enablePullDownRefresh。
• 可以通过wx.startPullDownRefresh触发下拉刷新，调用后触发下拉刷新动画，效果与用户手动下拉刷新一致。
• 当处理完数据刷新后，wx.stopPullDownRefresh可以停止当前页面的下拉刷新。

# onReachBottom()

监听用户上拉触底事件。

• 可以在app.json的window选项中或页面配置中设置触发距离onReachBottomDistance。
• 在触发距离内滑动期间，本事件只会被触发一次。

# onPageScroll(Object object)

监听用户滑动页面事件。

参数 Object object:

注意：请只在需要的时候才在 page 中定义此方法，不要定义空方法。以减少不必要的事件派发对渲染层-逻辑层通信的影响。 注意：请避免在 onPageScroll 中过于频繁的执行 setData 等引起逻辑层-渲染层通信的操作。尤其是每次传输大量数据，会影响通信耗时。

# onAddToFavorites(Object object)

本接口为 Beta 版本，安卓 7.0.15 版本起支持，暂只在安卓平台支持

监听用户点击右上角菜单“收藏”按钮的行为，并自定义收藏内容。

参数 Object object:

此事件处理函数需要 return 一个 Object，用于自定义收藏内容：

示例代码

Page({
  onAddToFavorites(res) {
    // webview 页面返回 webViewUrl
    console.log('webViewUrl: ', res.webViewUrl)
    return {
      title: '自定义标题',
      imageUrl: 'http://demo.png',
      query: 'name=xxx&age=xxx',
    }
  }
})

# onShareAppMessage(Object object)

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

注意：只有定义了此事件处理函数，右上角菜单才会显示“转发”按钮

参数 Object object:

此事件处理函数需要 return 一个 Object，用于自定义转发内容，返回内容如下：

自定义转发内容 基础库 2.8.1 起，分享图支持云图片。

示例代码

在开发者工具中预览效果

Page({
  onShareAppMessage() {
    const promise = new Promise(resolve => {
      setTimeout(() => {
        resolve({
          title: '自定义转发标题'
        })
      }, 2000)
    })
    return {
      title: '自定义转发标题',
      path: '/page/user?id=123',
      promise 
    }
  }
})

# onShareTimeline()

基础库 2.11.3 开始支持，低版本需做兼容处理。

详见分享到朋友圈

监听右上角菜单“分享到朋友圈”按钮的行为，并自定义分享内容。

注意：只有定义了此事件处理函数，右上角菜单才会显示“分享到朋友圈”按钮

自定义转发内容

事件处理函数返回一个 Object，用于自定义分享内容，不支持自定义页面路径，返回内容如下：

示例代码

Page({
  onShareTimeline() {
    const promise = new Promise(resolve => {
      setTimeout(() => {
        resolve({
          title: '自定义转发标题'
        })
      }, 2000)
    })
    return {
      title: '自定义转发标题',
      query: 'id=123',
      imageUrl: '/images/share.png',
      promise
    }
  }
})

# onResize(Object object)

基础库 2.4.0 开始支持，低版本需做兼容处理。

页面尺寸改变时触发。详见 响应显示区域变化

# onTabItemTap(Object object)

基础库 1.9.0 开始支持，低版本需做兼容处理。

点击 tab 时触发

Object 参数说明：

示例代码：

Page({
  onTabItemTap(item) {
    console.log(item.index)
    console.log(item.pagePath)
    console.log(item.text)
  }
})

# onSaveExitState()

基础库 2.7.4 开始支持，低版本需做兼容处理。

每当小程序可能被销毁之前，页面回调函数 onSaveExitState 会被调用，可以进行退出状态的保存。