codecamp

百度小程序全局配置

配置界面,路径


可以通过配置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发生错误时,会触发
百度智能小程序介绍
百度智能小程序页面开发
温馨提示
下载编程狮App,免费阅读超1000+编程语言教程
取消
确定
目录

百度智能小程序开发文档

百度智能小程序 组件

百度智能小程序 地图

百度智能小程序 画布

百度智能小程序 API

百度智能小程序 界面

百度智能小程序 关注小程序引导组件

百度智能小程序 自定义组件

百度智能小程序 媒体

百度智能小程序 设备

百度智能小程序 拨打电话

百度智能小程序 内存警报

百度智能小程序 手机联系人

百度智能小程序 用户截屏事件

百度智能小程序 第三方平台

百度智能小程序 开放接口

百度智能小程序 百度收银支付

百度智能小程序 分包预下载

百度智能小程序 数据分析

百度智能小程序 服务端

百度智能小程序 云开发

百度智能小程序 初始化

百度智能小程序 云函数

百度智能小程序 服务端初始化

百度智能小程序 服务器获取上下文

百度智能小程序 服务端云函数

百度智能小程序 开发教程

百度智能小程序 功能开发

百度智能小程序 基本原理

百度智能小程序 小程序自动化

百度智能小程序 视频教程

关闭

MIP.setData({ 'pageTheme' : getCookie('pageTheme') || {'day':true, 'night':false}, 'pageFontSize' : getCookie('pageFontSize') || 20 }); MIP.watch('pageTheme', function(newValue){ setCookie('pageTheme', JSON.stringify(newValue)) }); MIP.watch('pageFontSize', function(newValue){ setCookie('pageFontSize', newValue) }); function setCookie(name, value){ var days = 1; var exp = new Date(); exp.setTime(exp.getTime() + days*24*60*60*1000); document.cookie = name + '=' + value + ';expires=' + exp.toUTCString(); } function getCookie(name){ var reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)'); return document.cookie.match(reg) ? JSON.parse(document.cookie.match(reg)[2]) : null; }