小程序基础概念

文档地址

微信基础概念

App 小程序全局文件

app.js) 小程序逻辑，注册小程序

// app.js
App({
  onLaunch (options) {
    //生命周期回调——监听小程序初始化。
  },
  onShow (options) {
    // 生命周期回调——监听小程序启动或切前台。
  },
  onHide () {
    // 生命周期回调——监听小程序切后台。
  },
  onError (msg) {
    // 错误监听函数。
  },
  onPageNotFound() {
    // 小程序要打开的页面不存在时触发。
  },
  globalData: {} // 小程序全局数据
})

app.json 小程序全局配置

{
  "pages": [
    "pages/index/index",
    "pages/logs/index"
  ],
  "window": {
    "navigationBarTitleText": "Demo"
  },
  "tabBar": {
    "list": [{
      "pagePath": "pages/index/index",
      "text": "首页"
    }, {
      "pagePath": "pages/logs/logs",
      "text": "日志"
    }]
  },
  "networkTimeout": {
    "request": 10000,
    "downloadFile": 10000
  },
  "debug": true,
  "navigateToMiniProgramAppIdList": [
    "wxe5f52902cf4de896"
  ]
}

app.wxss 小程序全局样式文件， 类似css

sitemap.json 小程序索引文件，微信更加文件爬取小程序内容. sitemap.json

{
  "rules":[{
    "action": "allow",
    "page": "*"
  }]
}

Page 小程序页面文件

//index.js
Page({
  data: {
    // 页面数据
  },
  onLoad: function(options) {
    // 生命周期回调—监听页面加载
  },
  onReady: function() {
    // 生命周期回调—监听页面初次渲染完成
  },
  onShow: function() {
    // 生命周期回调—监听页面显示    
  },
  onHide: function() {
    // 生命周期回调—监听页面隐藏
  },
  onUnload: function() {
    // 生命周期回调—监听页面卸载
  },
  onPullDownRefresh: function() {
    // 监听用户下拉动作
  },
  onReachBottom: function() {
    // 页面上拉触底事件的处理函数
  },
  onShareAppMessage: function () {
    // 用户点击右上角转发
  },
  onPageScroll: function() {
    // 页面滚动触发事件的处理函数
  },
  onResize: function() {
    // 页面尺寸改变时触发
  },
  onTabItemTap(item) {
    // 当前是 tab 页时，点击 tab 时触发
  },
  // 自定义事件与数据 this.viewTap访问
  viewTap: function() {
    this.setData({
      text: 'Set some data for updating view.'
    }, function() {
      // this is setData callback
    })
  },
  customData: {
    hi: 'MINA'
  }
})

生命周期

我们来看看上面的一些概念道理具体的意思和操作是怎么样的。
onLaunch 当我们在微信上面点击小程序的时候，小程序处于初始化启动状态。
onShow 小程序在onLaunch之后就会显示出这个小程序的页面。
onHide 我们切换到其他app的时候，小程序就是处在后台状态，大概五分钟不处理会消亡
onShow 我们处理完之后再次调出小程序的时候。
onError 小程序出现错误
onPageNotFound 小程序页面不存在404

onLoad 类似onLaunch，某个页面加载渲染之前
onReady 页面渲染完成之后
onShow 页面显示在屏幕之时
onHide 页面隐藏
onUnload 页面卸载

image

getApp 获取app实例
getCurrentPage 获取当前页面实例