技術標籤：小程式引用其他頁面js小程式登入頁面程式碼小程式訂單點選不同頁面

註冊頁面

對於小程式中的每個頁面，都需要在頁面對應的 js 檔案中進行註冊，指定頁面的初始資料、生命週期回撥、事件處理函式等。

使用 Page 構造器註冊頁面

簡單的頁面可以使用 Page()進行構造。

程式碼示例：

//index.js
Page({
  data: {
    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.jsmodule.exports = Behavior({  data: {    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.jsvar 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({
  data: {
    text: "This is page data."
  },
  methods: {
    onLoad: function(options) {
// 頁面建立時執行
    },
    onPullDownRefresh: function() {
// 下拉重新整理時執行
    },
// 事件響應函式
    viewTap: function() {
// ...
    }
  }
})

這種建立方式非常類似於自定義元件，可以像自定義元件一樣使用 behaviors 等高階特性。