小程序app.js的配置

微信小程序必须通过官方的微信开发者工具进行开发,每一个页面都至少由两部分组成 .wxml,.js,也有可能会有 .wxss, .json它们分别对应普通的HTML,JS, CSS但是又有细微的差别。 

首先默认首页是index.wxml,其中app.js, app.json, app.wxs中存放一些全局公共的东西。

1.首先介绍app.json中的结构:

它是由json数据对构成,

eg:

{

"pages":[                      //各个页面的路径

"pages/index/index",    //默认的首页,排在第一个的时默认首页

"pages/logs/logs"

],

"window":{         //定义顶部导航条

"backgroundTextStyle":"light",

"navigationBarBackgroundColor": "#200C3F",      //顶部背景色

"navigationBarTitleText": "微信",                            //顶部文字内容

"navigationBarTextStyle":"#fff",                              //顶部文字颜色

"enablePullDownRefresh":true ,                             //是否可以下拉刷新

"backgroundColor":"#fff",                                      //下拉刷新时的背景颜色

},

"tabBar”:{              //定义底部切换按钮样式

"color":"#000”,        //未选中时字的颜色

"selectedColor":"red”,    //选中时字的颜色

"background":"#fff",        //背景颜色

"borderStyle":"#000",       //边框的颜色(白,黑)

"list":[{          //总共几个切换菜单就几个

"pagePath":"pages/index/index”, //点击时对应的页面

"text":"首页”,            //显示的文字

"iconPath":"images/footerShop.png”,      //图标的地址

"selectedIconPath":"images/footerShop1.png”     //选中时图标的地址

},{

"pagePath": "pages/logs/logs",

"text": "日志",

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

"selectedIconPath": "images/footerOrder1.png"

}]

},

"networkTimeout”:{         //网络请求超时时间

"request":30000,

"connectSocket":3000,

"uploadFile":3000,

"downloadFile":3000

},

"debug":true    //是否在控制台打印信息

}

 

  • 相关的颜色值除了黑白以外,都应该用#+三位十六进制的数字构成;
  •  navigationBarBackgroundColor 表示顶部颜色,可以任意;
  •  navigationBarTitleText 表示顶部的文字;
  • navigationBarTextStyle 表示顶部的文字颜色,只能有白色或者黑色;
  • enablePullDownRefresh 表示页面是否允许下拉刷新;
  • 本页面的各属性属于默认值,为全局变量,当其他的页面有相同的属性时该页面的属性将覆盖掉此属性,但是他只在某一页面内有效

2.app.wxss:

文件中写一些通用的css样式。

3.app.js:

本页面的各属性属于默认值,为全局变量,当其他的页面有相同的属性时该页面的属性将覆盖掉此属性,但是他只在某一页面内有效

 

你可能感兴趣的:(微信小程序)