3.1小程序框架

2020-12-15  本文已影响0人  棠人科技

 一个页面的JS文件主要包括:

1. data:页面数据

2. 生命周期函数(钩子函数):自动调用

3. 页面事件监听函数:自动调用

4. 用户自定义函数(自定义事件处理程序、其它方法)


生命周期函数:

   * 生命周期函数--监听页面加载

   * 用途:1. 初始化页面(变量) 2. 请求数据并处理(从服务器端获取页面所需的数)

   */

  onLoad: function (options) {

    // 1. 发起网络请求swiper相关数据

    this.getSwiper()

    // 

    // 3. 发起网络请求articlelist相关数据

    this.getArticleList(1)

    // 4. 将数据处理之后赋值给页面变量

    // 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 () {

    // 重新请求swiper的数据并更新data.swiperList

    // 重新请求博文列表的数据并更新data.articleList

    this.page = 1

    this.getSwiper()

    // 3. 发起网络请求articlelist相关数据

    this.getArticleList(1)

  },

  /**

   * 页面上拉触底事件的处理函数

   */

  onReachBottom: function () {

    // page为页面级的变量 

    ++this.page

    this.getArticleList(this.page)

  },

  /**

   * 用户点击右上角分享

   */

  onShareAppMessage: function () {

  },

上一篇下一篇

猜你喜欢

热点阅读