百度小程序全局配置

配置界面,路径


可以通过配置app.json文件,设置SWAN的界面,路径,多TAB等。

app.json配置项列表如下:

属性类型必填描述
网页{String,Array}设置页面路径
窗口目的设置页面展现

示例:

{ "pages": [ "pages/index/index", "pages/detail/detail" ], "window": { "navigationBarTitleText": "Demo" } }

pages


pages接受一个数组,每一项都是一个字符串,指定SWAN App都有哪些页面。每一项代表页面的[路径+文件名],数组第一项代表SWAN初始页面。

SWAN中新增或减少页面的话,需要在pages中进行配置。

配置项中不需要加文件后缀名,SWAN会自动解析。

如,开发目录为:

pages/ pages/index/index.swan pages/index/index.css pages/index/index.js pages/detail/detail.swan pages/detail/detail.css pages/detail/detail.jsapp.jsapp.jsonapp.css

则需要在app.json中书写:

{ "pages":[ "pages/index/index", "pages/detail/detail" ] }

window


用于设置SWAN的状态栏,导航条,标题,窗口背景色。

百度小程序全局配置
属性类型必填描述
navigationBarBackgroundColorHexColor#000000导航栏背景颜色,如“#000000”
navigationBarTextStyleStringwhite导航栏标题颜色,目前仅支持黑/白
navigationBarTitleTextString 导航栏标题文字内容
backgroundColorHexColor#FFFFFF背景颜色
backgroundTextStyleStringdark下拉背景字体,loading图的样式,仅支持暗/光
enablePullDownRefreshBooleanfalse是否开启下拉刷新
onReachBottomDistanceNumber50页面上拉触底事件触发时距页面底部距离,单位为px

示例:

{ "window":{ "navigationBarBackgroundColor": "#ffffff", "navigationBarTextStyle": "black", "navigationBarTitleText": "swan接口功能演示", "backgroundColor": "#eeeeee", "backgroundTextStyle": "light" } }

配置全局数据


app.js中存放全局的JS逻辑。

示例:

App({ onLaunch: function () { console.log(‘SWAN launch‘); }, onShow: function () { console.log(‘SWAN展现‘); }, onHide: function () { console.log(‘SWAN当前处于后台‘); }, onError: function () { console.log(‘SWAN发生错误‘); }, globalData: ‘SWAN‘ });

SWAN生命周期


属性类型描述触发时机
onLaunchFunctionSWAN初始化的生命周期函数当SWAN App初始化完成时,会触发onLaunch(全局只触发一次)
onShowFunctionSWAN App展示时调用的生命周期函数SWAN App从后台进入前台,触发onShow
onHideFunctionSWAN App隐藏时调用的生命周期函数SWAN App从前台进入后台,触发onHide
onLoadFunction监听页面加载的生命周期函数SWAN App页面加载完成,触发onLoad
onReadyFunction监听页面初次渲染完成的生命周期函数SWAN App页面渲染完成,触发onReady
onunloadFunction监听页面卸载的生命周期函数页面卸载,触发onUnload
onerrorFunction错误监听函数当SWAN App发生错误时,会触发

相关文章