学习小程序零到一经验分享2

app.json是什么?

app.json 是对当前小程序的全局配置，包括了小程序的所有页面路径、界面表现、网络超时时间、底部 tab 等。

project.config.json是什么？

针对各自喜好做一些个性化配置，例如界面颜色、编译配置等等。

一个页面内容讲解

分享1中我们已经说了，每一个页面均有自己的json、wxml、wxss。从事过网页编程的人知道，网页编程采用的是 HTML + CSS + JS 这样的组合。

界面与Js交互信息

生命周期理解

Page({

  data:{

    names:"tangdekun test1"  },

  onLoad:function(options){    // 生命周期函数--监听页面加载    console.log("test1 onLoad");

  },

  onReady:function(){    // 生命周期函数--监听页面初次渲染完成    console.log("test1 onReady");

  },

  onShow:function(){    // 生命周期函数--监听页面显示  console.log("test1 onShow");

  },

  onHide:function(){    // 生命周期函数--监听页面隐藏    console.log("test1 onHide");

  },

  onUnload:function(){    // 生命周期函数--监听页面卸载    console.log("test1 onUnload");

  },

  onPullDownRefresh: function(){    // 页面相关事件处理函数--监听用户下拉动作    console.log("test1 onPullDownRefresh");

  },

  onReachBottom: function(){    // 页面上拉触底事件的处理函数    console.log("test1 onReachBottom");

  }

})

每一个页面均有默认的生命周期，对应不同的状态时候自动触发。譬如，我们想打开一个页面想看到列表，那么我们就要将加载列表的逻辑放在onload或onready或onshow里面，当然不是随便放的。有的周期只进行一次譬如onload，有的在每次页面显示时候启动譬如onshow。看需求而定

在了解完生命周期我觉得就差不多可以正式开发了。值得一提：小程序还为广大的开发者提供了封装好的组件（scrollview、button、input、map地图、video...），还有就是微信承诺的强大的API，我们能靠它获取用户信息、微信支付、使用蓝牙NFC功能..

来自小程序API文档里，我们看到【在开发者工具中预览效果】

对初学开发者的福音，我们不用自己复制粘贴示例代码，直接点击连接会自动开启开发者工具使用demo。方便了学习

赶快试一下查询天气然后显示出来吧~