00 小程序开发基础

AppID：小程序的AppID相当于小程序平台的一个身份证。
AppID查看：登录https://mp.weixin.qq.com，在“设置”-“开发设置” 中可以看到AppID

微信小程序架构.png

1. JSON配置文件

2. WXML模板文件
传统网页开发采用HTML+CSS+JS的方式，而小程序中WXML类似HTML的作用。
但WXML同于HTML：

标签名不同：小程序常用标签有view, button, text 等，并封装了地图、视频、音频等实用组件
包含多了一些 wx:if 这样的属性以及 {{ }} 这样的表达式：借鉴渲染与逻辑分离的思路（JS只管理状态，而不直接操作DOM），其中{{}}将变量绑定在界面上，wx:开头具备一定控制作用，辅助数据绑定来描述状态和界面的关系

3. WXSS样式文件
类似CSS，但与CSS不同点：

4. JS脚本文件

{{ msg }}

button上添加一个属性bindtap在JS文件中响应这次点击

Page({
  clickMe: function() {
    this.setData({ msg: "Hello World" })
  }
})

此外，JS文件可以调用wx提供的各种API

小程序包含描述整体程序的app和多个描述各个页面的page
小程序主体包含三个文件，位于项目根目录下

一个页面由四个文件组成，四个文件的路径和文件名需要一致

App({
  onLaunch: function () {
    // 小程序启动之后 触发
  }
})

页面渲染
微信客户端首先[1]根据logs.json生成一个界面（包含顶部颜色文字等等），然后[2]根据WXML和WXSS装载页面结构和样式，最后装载JS文件

Page({
  data: { // 参与页面渲染的数据
    logs: []
  },
  onLoad: function () {
    // 页面渲染后 执行
  }
})

wx.getLocation({
  type: 'wgs84',
  success: (res) => {
    var latitude = res.latitude // 经度
    var longitude = res.longitude // 纬度
  }
})

调用扫一扫

wx.scanCode({
  success: (res) => {
    console.log(res)
  }
})

版本	说明
开发版本	使用开发者工具，可将代码上传到开发版本中。开发版本只保留每人最新的一份上传的代码。点击提交审核，可将代码提交审核。开发版本可删除，不影响线上版本和审核中版本的代码。
审核中版本	只能有一份代码处于审核中。有审核结果后可以发布到线上，也可直接重新提交审核，覆盖原审核版本。
线上版本	线上所有用户使用的代码版本，该版本代码在新版本代码发布后被覆盖更新。