微信小程序学习(2)- 逻辑层

2021/6/16 12:22:59

本文主要是介绍微信小程序学习(2)- 逻辑层,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

注册小程序

每个小程序都需要在 app.js 中调用 App 方法注册小程序实例,绑定生命周期回调函数、错误监听和页面不存在监听函数等。

App({

  /**
   * 当小程序初始化完成时,会触发 onLaunch(全局只触发一次)
   */
  onLaunch: function () {
    // some code;
  },

  /**
   * 当小程序启动,或从后台进入前台显示,会触发 onShow
   */
  onShow: function (options) {
    // some code;
  },

  /**
   * 当小程序从前台进入后台,会触发 onHide
   */
  onHide: function () {
    // some code;
  },

  /**
   * 当小程序发生脚本错误,或者 api 调用失败时,会触发 one rror 并带上错误信息
   */
  one rror: function (msg) {
    // some code;
  },
  
  /**
   * 自定义函数
   */
  getUserInfo: function(callback){
    // some code;
  },

  /**
   * 自定义数据
   */
  globalData: 'I am global data'
})

整个小程序只有一个 App 实例,是全部页面共享的。开发者可以通过 getApp 方法获取到全局唯一的 App 实例,获取App上的数据或调用开发者注册在 App 上的函数。

// xxx.js
const appInstance = getApp()
getUserInfo(function(){
  // ...
})
console.log(appInstance.globalData) // I am global data

 详细的参数含义和使用请参考官方 App 参考文档 。

 

注册页面

对于小程序中的每个页面,都需要在页面对应的 js 文件中进行注册,指定页面的初始数据、生命周期回调、事件处理函数等。

使用 Page 构造器注册页面

简单的页面可以使用 Page() 进行构造。

Page({

  /**
   * 页面的初始数据
   */
  data: {
    // some code;
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onl oad: function (options) {
    // some code;
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {
    // some code;
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {
    // some code;
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {
    // some code;
  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {
    // some code;
  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {
    // some code;
  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {
    // some code;
  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {
    // some code;
  },

  /**
   * 页面滚动时执行
   */
  onPageScroll: function () {
    // some code;
  },

  /**
   * 页面尺寸变化时执行
   */
  onResize: function () {
    // some code;
  },

  
})

详细的参数含义和使用请参考官方 Page 参考文档 。

 

使用 Component 构造器构造页面

Page 构造器适用于简单的页面。但对于复杂的页面, Page 构造器可能并不好用。

此时,可以使用 Component 构造器来构造页面。 Component 构造器的主要区别是:方法需要放在 methods: { } 里面。

Component({
  data: {
    text: "This is page data."
  },
  methods: {
    /**
     * 页面创建时执行
     */
    onl oad: function (options) {
      // some code;
    },

    /**
     * 下拉刷新时执行
     */
    onPullDownRefresh: function (options) {
      // some code;
    },

    /**
     * 事件响应函数
     */
    viewTap: function (options) {
      // some code;
    }
  }
})

 

 



这篇关于微信小程序学习(2)- 逻辑层的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!


扫一扫关注最新编程教程