总结小程序开发文档

// app.js onShow: function () {
    var that = this
    // 展示本地存储能力
    var logs = wx.getStorageSync(&＃39;logs&＃39;) || []
    logs.unshift(Date.now())
    wx.setStorageSync(&＃39;logs&＃39;, logs)
    // 获取用户信息
    wx.getSetting({
      success: res => {
        if (res.authSetting[&＃39;scope.userInfo&＃39;]) {
          // 已经授权，可以直接调用 getUserInfo 获取头像昵称，不会弹框
          wx.getUserInfo({
            success: res => {
              // 可以将 res 发送给后台解码出 unionId
              that.globalData.userInfo = res.userInfo              // 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回
              // 所以此处加入 callback 以防止这种情况
              if (that.userInfoReadyCallback) {
                that.userInfoReadyCallback(res)
              }
              // 执行项目内部操作
              that.onLogin()
            }
          })
        }else{
          // 没有授权，跳转授权登录页
          wx.redirectTo({
            url: &＃39;/pages/login/login&＃39;,
          })
        }
      }
    })
  },

允许获取公开信息

// login.jsonGetUserInfo: function (e) {
   app.globalData.userInfo = e.detail.userInfo  // 返回的用户信息}

如果需要将微信账号信息与自己的项目账号做绑定，那么可以将获取到的微信账号信息作为参数传送给后台，后台生成一个相对应的项目账号。

3. 小程序配置 : 全局&页面

全局配置

app.json是小程序的全局配置，包括小程序的所有页面路径、界面表现、底部 tab 等，一般包含几个字段：pages、window、tabBar
tabBar字段 —— 定义小程序底部tab栏的表现，以及 tab 切换时显示的对应页面。

{
  "pages": [
    "pages/index/index", 
    "pages/logs/index"
  ], // 所有页面路径
  "window": {
    "backgroundTextStyle": "light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "WeChat",
    "navigationBarTextStyle": "black"
  }, // 界面表现
  "tabBar": {
    "backgroundColor": "#F7F7FA",
    "color": "#757575",
    "selectedColor": "#6D8FE8",  // 底部栏配置
    "list": [  // tab列表
      {
        "pagePath": "pages/message/index/index",  // tab对应页面路径
        "text": "消息", // tab文字显示
        "iconPath": "images/icon_message.png",  // tab默认显示图标
        "selectedIconPath": "images/icon_message_blue.png" // tab选中后的图标
      },
      {
        "pagePath": "pages/zone/index/index",
        "text": "空间",
        "iconPath": "images/icon_friend.png",
        "selectedIconPath": "images/icon_friend_blue.png"
      }
  }
 }

注： tab栏的图标icon 大小限制为40kb，建议尺寸为 81px * 81px，不支持网络图片，同时tab列表配置最少2个，最多5个。

页面配置

一个小程序页面由四个文件组成：

1. .json 后缀的 JSON 配置文件
2. .wxml 后缀的 WXML 模板文件
3. .wxss 后缀的 WXSS 样式文件
4. .js 后缀的 JS 脚本逻辑文件

每个小程序页面可以使用自己的.json文件来对本页面的窗口表现进行配置。
页面配置一般包括导航栏标题文字内容（navigationBarTitleText），是否开启下拉刷新（enablePullDownRefresh）等等。

页面的配置只能设置 app.json 中部分 window 配置项的内容，页面中配置项会覆盖 app.json 的 window 中相同的配置项。

{
  "navigationBarTitleText": "个人中心",
  "enablePullDownRefresh": true,
  "backgroundTextStyle": "dark"}

4. 小程序组件及页面介绍

小程序为开发者提供了一系列基础组件，开发者可以通过组合这些基础组件进行快速开发。
组件是视图层的基本组成单元，一个组件通常包括 开始标签 和 结束标签，属性 用来修饰这个组件，内容 在两个标签之内，例如：

这是内容

注意：所有组件与属性都是小写，以连字符-连接

小程序组件参考。

页面的生命周期：

页面A：

	wx.navigateTo({
      url: &＃39;../unrelate/unrelate?cname=&＃39;+cname+&＃39;&cid=&＃39;+cid,
    })

页面B：

onLoad: function (options) {
    if(options.cname){
      this.setData({
        cname: options.cname,
        cid: options.cid      })
    }
  }

2. 如果页面之间需要传递的参数为对象或者数组，那么通过路由拼接参数的形式就不可取了，此时可以通过app.js中的globalData全局变量进行赋值。
   页面A：

  onJumpToNextLevelPoint: function(e){
    let child = e.currentTarget.dataset.child    let name = e.currentTarget.dataset.name    if(util.isValidArray(child)){
      app.globalData.pointChild = child // 全局变量进行赋值
      wx.navigateTo({
        url: &＃39;../knowledge/knowledge?name=&＃39; + name,
      })
    }
  }

页面B：

  onLoad: function (options) {
    if (util.isValidArray(app.globalData.pointChild)) {
      this.setData({
        progressList: app.globalData.pointChild      })
    }
  }

5. 如何开发公共代码

开发公共组件，个人使用的是component构造器定义公共组件。
Component构造器可用于定义组件，调用Component构造器时可以指定组件的属性、数据、方法等。
具体开发方式是：

1. 项目外层目录中创建components文件夹，创建组件文件夹然后新建Component，在这里写好公共组件的页面结构，样式，事件等。
   调用微信扫一扫功能：

   	wx.scanCode({        //扫描API
         success: function (res) {
           that.setData({
             IMECode: res.result        });
           // 接下来执行自己的业务逻辑
           that.ChkWXZIme(res.result)
         }
       })

   调起本地相册选择图片或使用相机拍照功能（适用于更换头像）：

   wx.chooseImage({
         count: 1,
         sizeType: [&＃39;original&＃39;, &＃39;compressed&＃39;],
         sourceType: [&＃39;album&＃39;, &＃39;camera&＃39;],
         success(res) {
           // tempFilePath可以作为img标签的src属性显示图片
           let tempFilePaths = res.tempFilePaths
           that.setData({
             &＃39;userInfo.Avatar&＃39;: tempFilePaths[0]
           })
         },
         fail() {
           that.setData({
             chooseImg: false
           })
         }
       })

   发起网络请求：

   	wx.request({
         url: &＃39;&＃39;
         method: &＃39;POST&＃39;,
         header: {
           &＃39;content-type&＃39;: &＃39;application/x-www-form-urlencoded&＃39;
         },
         data: {
           session: app.globalData.session      },
         success: function(res){}
       })

   更多的 API 能力见 小程序的API。

   7. 代码的审核与发布

   提交审核

   为了保证小程序的质量，以及符合相关的规范，小程序的发布是需要经过审核的。

   在开发者工具中上传了小程序代码之后，登录 小程序管理后台 - 开发管理 - 开发版本 找到提交上传的版本。

   在开发版本的列表中，点击 提交审核 按照页面提示，填写相关的信息，即可以将小程序提交审核。

   需要注意的是，请开发者严格测试了版本之后，再提交审核， 过多的审核不通过，可能会影响后续的时间。

   发布

   审核通过之后，管理员的微信中会收到小程序通过审核的通知，此时登录 小程序管理后台 - 开发管理 - 审核版本中可以看到通过审核的版本。

   请点击发布，即可发布小程序。

   附：版本号书写规范

   major.minor.patch
   主版本号.次版本号.修补版本号

   patch： 修复bug，兼容老版本
   minor：新增功能，兼容老版本
   major：新的架构调整，不兼容老版本

   相关学习推荐：微信小程序教程

   以上就是总结小程序开发文档的详细内容，更多请关注其它相关文章！