微信小程序(32):生命週期:頁面生命週期

在這裏插入圖片描述


在demo.json中添加以下代碼,開啓橫屏豎屏

"pageOrientation":"auto"

下拉刷新配置

"enablePullDownRefresh": true,
    "backgroundColor": "yellow"

在這裏插入圖片描述


// pages/demo18/demo18.js
Page({

  /**
   * 頁面的初始數據
   */
  data: {

  },

  /**
   * 生命週期函數--監聽頁面加載
   */
  onLoad: function (options) {
    console.log("onLoad");
  },

  /**
   * 生命週期函數--監聽頁面初次渲染完成
   */
  onReady: function () {
    console.log("onReady");

  },

  /**
   * 生命週期函數--監聽頁面顯示
   */
  onShow: function () {
    console.log("onShow");

  },

  /**
   * 生命週期函數--監聽頁面隱藏
   */
  onHide: function () {
    console.log("onHide");

  },

  /**
   * 生命週期函數--監聽頁面卸載
   */
  onUnload: function () {
    console.log("onUnload");

  },

  /**
   * 頁面相關事件處理函數--監聽用戶下拉動作
   */
  onPullDownRefresh: function () {
    console.log("onPullDownRefresh");
    // 頁面的數據 或者效果 重新刷新
  },

  /**
   * 頁面上拉觸底事件的處理函數
   * 需要讓頁面出現上下滾動才行
   */
  onReachBottom: function () {
    console.log("onReachBottom");
// 上拉加載下一頁數據
  },

  /**
   * 用戶點擊右上角分享
   */
  onShareAppMessage: function () {
    console.log("onShareAppMessage");

  },
  // 頁面滾動,就可以觸發
  onPageScroll(){
    console.log("onPageScroll");

  },
  // 頁面的尺寸發生改變的時候觸發
  // 小程序發生了橫屏,豎屏切換的時候觸發
  onResize(){
    console.log("onResize");

  },
  // 必須要求當前頁面,也是tabbar頁面
  // 點擊的自己的tab item的時候才觸發
  onTabItemTap(){
    console.log("onTabItemTap");

  }
})
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章