微信小程序开发

“微信”小程序开发(一)第一章 开发步骤第 1 节:小程序构成第 2 节:APP、JSON 结构Pag ｅ s：小程序组成页面；Window ｓ：窗口样式设定、第 3 节:APP、JS 结构：APP 、 JSONAPP 、 JSAPP 、 WXSS调用函数 定义娈量 引用接口组成页面 窗口参数公共样式{ "pages":[ "pages/index/index", "pages/logs/logs" ], "window":{ "backgroundTextStyle":"light", "navigationBarBackgroundColor": "#fff", "navigationBarTitleText": "WeChat", "navigationBarTextStyle":"black" }}App({ onLaunch: function () { var logs = wx 、 getStorageSync('logs') || [] logs 、 unshift(Date 、 now()) wx 、 setStorageSync('logs', logs) }, getUserInfo:function(cb){ var that = this; if(this 、 globalData 、 userInfo){ typeof cb == "function" && cb(this 、 globalData 、 userInfo) }else{ wx 、 login({ success: function () { wx 、 getUserInfo({ success: function (res) { that 、 globalData 、 userInfo = res 、 userInfo; typeof cb == "function" && cb(that 、 globalData 、 userInfo) } }) } }); } }, globalData:{ userInfo:null }})第 4 节:Ａ PP、WXSS 结构第５节：页面结构１、页面文件资源结构2、页面配置文件:pa ｇ e_ｎ a ｍ e、ｊ s ｏ n页面得配置文件就是非必要得.当有页面得配置文件时，配置项在该页面会覆盖 a ｐｐ、json 得 w ｉｎ dow 中相同得配置项。假如没有指定得页面配置文件 ,则在该页面直接使用 app、jso ｎ 中得默认配置。３、页面主文件：page＿na ｍｅ、wxm ｌ、 container { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: space-between; padding: 200rpx 0; box-sizing: border-box;}Page_name 、 jsonPage_name 、 wxmlPage_name 、 jsPage_name 、 wxss页面配置文件页面主文件页面 JS 文件页面样式文件4、页面Ｊ S 文件：ｐ age_ｎａ me、js {{userInfo 、 nickName}} {{motto}} var app = getApp()Page({ data: { motto: 'Hello World', userInfo: {}}, bindViewTap: function() { wx 、 navigateTo({url: ' 、、 /logs/logs})' }, onLoad: function () { var that = this app 、 getUserInfo(function(userInfo){ that 、 setData({ userInfo:userInfo }) }) }})5、页面样式文件:pa ｇ e_name、wxss请阅读第二章〈＜“微信"小程序开发（二）〉＞、 userinfo { display: flex; flex-direction: column; align-items: center;}、 userinfo-avatar { width: 128rpx; height: 128rpx; margin: 20rpx; border-radius: 50%;}、 userinfo-nickname { color: #aaa;}、 usermotto { margin-top: 200px;}