小程序學習筆記(1)

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:頁面中包含<web-view>組件時，返回當前<web-view>的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中獲取。