微信小程序教程：app配置指南

//app.json页面

{

//页面登记注册，存有几个页面都必须在pages里面登记注册

"pages":[

"pages/index/index",

"pages/logs/logs",

"pages/main/main",

"pages/main1/main1",

"pages/main2/main2",

"pages/main3/main3",

],

//上导航系统布局及app背景颜色设置

"window":{

//与否打开下拉创下

"enablePullDownRefresh":true,

//窗口背景颜色，在上拉创下，下拉创下，navigate转换页面时可以看到

"backgroundColor":"#eee",

//下拉背景字体、loading 图的样式，仅积极支持 dark/light,（string形式）

"backgroundTextStyle":"light",

//上导航条背景颜色

"navigationBarBackgroundColor": "orange",

//上导航系统标题文字

"navigationBarTitleText": "上导航系统标题文字",

"navigationBarTextStyle":"white" //上导航系统标题字体颜色，仅积极支持white和black

},

//底部导航系统布局

"tabBar": {

"color": "#a9b7b7",//导航系统字体预设颜色

"selectedColor": "#eb4f38",//导航系统字体选上时颜色

"borderStyle": "black", //上border颜色，仅积极支持 black/white（string形式）

"backgroundColor": "rgba(0,0,0,0.4)",//底部导航系统背景色

"list": [ //导航系统列表2-5个

{

"pagePath": "pages/index1/index1", //每个导航系统的网页对应的路径

"text": "首页", //标题

"iconPath": "images/wechat.png", //预设小图标路径

"selectedIconPath": "images/wechatHL.png" //选上时的小图标路径

},

{

"pagePath": "pages/index2/index2",

"text": "日记",

"iconPath": "images/pause.png",

"selectedIconPath": "images/play.png"

},

{

"pagePath": "pages/index3/index3",

"text": "指南",

"iconPath": "images/pause.png",

"selectedIconPath": "images/play.png"

},

]

},

//网络命令超时时间

"networkTimeout": {

"request": 10000,

"downloadFile": 9000,

"uploadFile":8000,

"connectSocket":7000

},

//与否打开debug模式

"debug": true

}

//表明：根据官方文档，上述color和bg-color类型为HexColor即16十进制类型，（选定仅积极支持 black/white，string形式的除外），但量测rbg,rgba和red这些类型目前也积极支持，但是建议大家还是按文档建议去设置为16十进制类型即为: #ffffff 类型；

//

//采用时仅须要将文件激活下来，根据市场需求改动即可；

//

//app.json为标准的json文件，所以无法存有存有注解，采用的时候须要把注解换成；

//app.js页面

App({

//当小程序初始化顺利完成时，可以引爆 onLaunch（全局只引爆一次）

onLaunch: function () {

//onLaunch时调用API从本地内存中获取数据

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{

//调用登入USB

wx.login({

success: function () {

wx.getUserInfo({

success: function (res) {

that.globalData.userInfo = res.userInfo

typeof cb == "function" && cb(that.globalData.userInfo)

}

})

}

})

}

},

//以获取后台数据

onshow:function(){

wx.request({

url: 'test.php',

data: {

x: 'xxx',

y: 'yyy'

},

header: {

'Content-Type': 'application/json'

},

success: function(res) {

console.log(res.data)

}

})

},

//设置全局数据

//本页面通过this.globalData即可获得数据

globalData:{

userInfo:null

}

//其他页面可以通过getApp()以获取至小程序实例

//其他页面可以通过getApp().globalData.xxx以获取至全局数据

})

//app.wxss页面

.common {

height: 100%;

display: flex;

flex-direction: column;

align-items: center;

justify-content: space-between;

padding: 200rpx 0;

box-sizing: border-box;

}

//仅积极支持:

类:.common

ID:#common

标签：common

多个标签：common1,common2

伪类::after

伪类::before

//不积极支持层级，如.common > view 或者.common view

//导入代莱单位rpx:

rpx（responsive pixel）: 可以根据屏幕宽度展开自适应。规定屏幕阔为750rpx。例如在 iPhone6 上，屏幕宽度为375px，共计750个物理像素，则750rpx = 375px = 750物理像素，1rpx = 0.5px = 1物理像素。

及代莱rem:

rem（root em）: 规定屏幕宽度为20rem；1rem = (750/20)rpx 。

//写下在app.wxss里面的样式将被设置为公有的，对于其他页面都就是需用的