微信小程序 目录结构

微信小程序类似于HTML的开发，即一个微信小程序页面由页面描述文件、一个页面逻辑文件、一个样式文件来进行描述。



在主目录中的3个以app开头的文件就是小程序架构的主述文件，这3个文件不属于任何页面。

page目录下有子目录 每个子目录中保存着一个页面的相关文件，通常包含4中不同的扩展名的文件 js、wxml、wxss、json（描述界面的这4个文件必须具有相同的的路径于文件名）

                                           

微信小程序目录架构       



主配置文件app.json

{
"pages":[
"pages/calc/calc",
"pages/icon/icon",
"pages/index/index",
"pages/logs/logs"
],
"window":{
"backgroundTextStyle":"light",
"navigationBarBackgroundColor":
"#fff",
"navigationBarTitleText":
"WeChat",
"navigationBarTextStyle":"black"
}
}

逻辑层 js 文件

//app.js
App({
onLaunch: function
() {
// 展示本地存储能力
var logs = wx.getStorageSync('logs')
|| []
logs.unshift(Date.now())
wx.setStorageSync('logs', logs)

// 登录
wx.login({
success: res
=> {
// 发送 res.code 到后台换取 openId, sessionKey, unionId
}
})
// 获取用户信息
wx.getSetting({
success: res
=> {
if (res.authSetting['scope.userInfo'])
{
// 已经授权，可以直接调用 getUserInfo 获取头像昵称，不会弹框
wx.getUserInfo({
success: res
=> {
// 可以将 res 发送给后台解码出 unionId
this.globalData.userInfo
= res.userInfo

// 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回
// 所以此处加入 callback 以防止这种情况
if (this.userInfoReadyCallback)
{
this.userInfoReadyCallback(res)
}
}
})
}
}
})
},
globalData: {
userInfo: null
}
})