一.微信开发工具简介.
1. 创建新的项目.
2. 微信小程序开发工具功能分类.
3. 调试期支持http.
微信小程序需要https请求,(没有https证书的可以再调试时设置支持http)
4.添加编译模式。
微信小程序开发工具可以针对于某一个特定的页面进行编译。
二.小程序的目录结构.
1. pages: 页面文件.包含一个页面所需的所有文件.
- js文件为逻辑控制层.
- wxml文件为页面展示层(类似于xml).
- wxss文件为样式层(类似于css).
2. app.js文件为程序初始化话文件(相当于Android中的application).
App({//如下为小程序的生命周期
onLaunch: function() { },//生命周期回调——监听小程序初始化。
onShow: function() { },//生命周期回调——监听小程序启动或切前台。
onHide: function() { },//生命周期回调——监听小程序切后台。
onError: function(msg) { },//错误监听函数。
onPageNotFound:function() { }//页面不存在监听函数。
})
3. app.json 小程序配置.
image.png
4. app.wxss 为全局样式设置.
三.微信小程序内测人员添加.
四.page.js回调函数.
Page({
data: {text: "This is page data."},//页面的初始数据
onLoad: function(options) { },//生命周期回调—监听页面加载
onReady: function() { },//生命周期回调—监听页面初次渲染完成
onShow: function() { },//生命周期回调—监听页面显示
onHide: function() { },//生命周期回调—监听页面隐藏
onUnload: function() { },//生命周期回调—监听页面卸载
onPullDownRefresh: function() { },//监听用户下拉动作
onReachBottom: function() { },//页面上拉触底事件的处理函数
onShareAppMessage: function () { },//监用户点击右上角转发
//如下为自定义的事件处理函数（视图中绑定的）
viewTap: function() {
//setData设置数据绑定data值，同时将更新视图
this.setData({text: 'Set some data for updating view.'})
}
})
data 是页面第一次渲染使用的初始数据。
页面加载时，data 将会以JSON字符串的形式由逻辑层传至渲染层，因此data中的数据必须是可以转成JSON的类型：字符串，数字，布尔值，对象，数组。
渲染层可以通过 [WXML]对数据进行绑定。
示例代码：
<view>{{text}}</view>
<view>{{array[0].msg}}</view>
Page({
data: {
text: 'init data',
array: [{msg: '1'}, {msg: '2'}]
}
})
