微信小程序入门

最近开始做微信小程序，这里记一些微信小程序的基础

开发微信小程序，首先得有一个微信号，然后到微信小程序官方网站里下载一个微信小程序开发者工具，对微信小程序的开发、调试、运行、发布都在这上面操作，微信小程序官网：https://mp.weixin.qq.com/debug/wxadoc/dev/

开发者工具下载好了就可以去申请一个小程序账号，当然也可以不申请，在创建小程序时，就没有APPID，也不能上传发布，如果只是个人想要学习一下，不申请也没多大影响，如果是公司开发就一定要申请一个账号。

创建一个微信小程序，要先在你想要创建小程序的位置创建一个新的空文件夹，改好名字，然后打开微信开发者工具，依次点击项目->新建项目，在弹出框里选择刚才新建的文件夹位置，如果有APPID就填上APPID，没有可以不填，选择快速启动模板，然后创建项目，一个微信小程序就建好了。要注意的是在创建项目后无法修改APPID，只能新建一个项目，把原来写的东西拷进去。

微信小程序运行时，最开始运行的是app.js，这里面一般都会写登录，获取用户信息，检测session之类的，然后运行app.json，运行第一个页面，app.wxss是全局样式，公共样式可以写到里面，要引入的外部样式也写在里面。pages文件夹里面写的页面，也可以新建文件夹写页面，放图片等。微信小程序里一个页面一般由四个文件组成，分别是以*.wxml,*.wxss,*.js,*.json，要注意他们的命名一样，代表的意思依次为页面，样式表，js文件，配置文件，如果想使用其他的样式表，可以引入。

到这里对小程序有一个基本的了解了，下面就是直接开始写程序了，微信小程序有自己定义的一套标签，大部分和普通的HTML标记相似，但有一点区别，微信小程序没有div，h1-h6，p等标记，新增了view，block等，具体可以看微信小程序官方文档的组件部分。

微信小程序和vue有一定的相似之处，数据可以双向绑定，但不似vue那么简便。如果想要双向绑定数据，页面上使用大括号把要绑定的变量括起来，再在页面上绑定一个事件，在js文件的data里定义这个变量，在事件的方法里使用setData来修改值，这种修改方式才会让修改同步到页面上，如果使用等号来修改，则不会同步修改页面数据。微信小程序想要获取页面数据也是和vue不同，需要使用data-XX来定义要获取的数据，在这个要获取数据的元素上绑定一个事件，通过e.target.dataset.xx或e.currentTarget.dataset.xx方式获取数据，如果是input和textarea则要使用value定义值，使用bindinput获取值，在e.detail.value里。

微信小程序里列表渲染，条件渲染等使用和vue相似，在标记上使用wx：for={{data}}，wx：if={{true}}等，具体可以看官方文档的框架部分

微信小程序里也有很多api，例如登录，上传下载，位置，数据缓存等，具体看官方文档的API部分

微信小程序有很多类似vue的钩子函数，从进入页面到销毁都有，还有上划加载等，具体参考官网，下方列出一些常用的：

 /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    
    this.setData({
      'userInfo.icon': app.globalData.userInfo.icon,
      'userInfo.nickname': app.globalData.userInfo.nickname,
    })
  },

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

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

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

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

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

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

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

到这，基础部分也差不多了，官方文档还是很有用的，有问题时可以多看看