配置界面,路径
可以通过配置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.js
app.js
app.json
app.css
则需要在app.json中书写:
{
"pages":[
"pages/index/index",
"pages/detail/detail"
]
}
window
用于设置SWAN的状态栏,导航条,标题,窗口背景色。
属性 | 类型 | 必填 | 描述 |
---|---|---|---|
navigationBarBackgroundColor | HexColor | #000000 | 导航栏背景颜色,如“#000000” |
navigationBarTextStyle | String | white | 导航栏标题颜色,目前仅支持黑/白 |
navigationBarTitleText | String | 导航栏标题文字内容 | |
backgroundColor | HexColor | #FFFFFF | 背景颜色 |
backgroundTextStyle | String | dark | 下拉背景字体,loading图的样式,仅支持暗/光 |
enablePullDownRefresh | Boolean | false | 是否开启下拉刷新 |
onReachBottomDistance | Number | 50 | 页面上拉触底事件触发时距页面底部距离,单位为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生命周期
属性 | 类型 | 描述 | 触发时机 |
---|---|---|---|
onLaunch | Function | SWAN初始化的生命周期函数 | 当SWAN App初始化完成时,会触发onLaunch(全局只触发一次) |
onShow | Function | SWAN App展示时调用的生命周期函数 | SWAN App从后台进入前台,触发onShow |
onHide | Function | SWAN App隐藏时调用的生命周期函数 | SWAN App从前台进入后台,触发onHide |
onLoad | Function | 监听页面加载的生命周期函数 | SWAN App页面加载完成,触发onLoad |
onReady | Function | 监听页面初次渲染完成的生命周期函数 | SWAN App页面渲染完成,触发onReady |
onunload | Function | 监听页面卸载的生命周期函数 | 页面卸载,触发onUnload |
onerror | Function | 错误监听函数 | 当SWAN App发生错误时,会触发 |