微信小程序 开发之全局配置
一、什么是全局配置？
全局配置是指在小程序开发中，对整个小程序进行统一配置的一种方式。全局配置包括了小程序的一些基本信息，如小程序名称、AppID、默认页面等；同时还可以设置一些全局样式、网络请求、页面生命周期等。
全局配置可以简化开发流程，提高开发效率，更好地掌控整个小程序。
二、全局配置的相关内容
1. app.json文件
app.json是小程序的全局配置文件，必须存在于小程序的根目录。它用于配置小程序的基本信息、页面路径、窗口表现、网络超时时间等。
下面是一个简单的app.json文件示例：
{
"pages": [
"pages/index/index",
"pages/logs/index"
],
"window": {
"backgroundColor": "#F5f5f5",
"navigationBarBackgroundColor": "#fff",
"navigationBarTextStyle": "black",
"navigationBarTitleText": "网易云音乐"
},
"networkTimeout": {
"request": 10000,
"downloadFile": 10000
}
}
其中，pages字段用于配置小程序的页面路径，数组中第一项为小程序的初始页面，后面的页面作为小程序的所有页面。window字段用于配置小程序的窗口表现，如背景色、导航栏背景色等。networkTimeout字段用于配置小程序的网络超时时间。
2. 全局样式
我们可以在app.wxss文件中定义全局样式，这样所有页面都会继承这些样式。
/* app.wxss */
/* 全局字体颜色 */
:root {
--color-text-regular: #666;
--color-text-title: #000;
}
/* 全局背景色 */
body {
background-color: #f5f5f5;
}
/* 全局字体大小 */
/* 页面中使用到的字体大小都会被乘上该系数 */
:root {
--font-size: 1.2rpx;
}
3. 网络请求
我们可以使用wx.request方法进行网络请求，但是我们也可以设置全局配置，以便同一份配置被多个请求使用。
/* app.js */
App({
globalData: {
serverUrl: 'https://example.com/api',
token: ''
},
getRequestOptions() {
return {
header: {
'Authorization': 'Bearer ' + this.globalData.token
}
}
}
})
上面代码中，我们使用App对象来定义全局数据和方法。getRequestOptions方法用于获取请求的配置，包括请求头Authorization字段。
我们在页面中使用wx.request方法时，可以直接获取全局配置，而不用每次重复设置。
/* pages/index/index.js */
Page({
onLoad() {
wx.request({
url: getApp().globalData.serverUrl + '/user/1',
...getApp().getRequestOptions()
success(res) {
console.log(res.data)
}
})
}
})
4. 页面生命周期
小程序的页面生命周期包括onLoad、onReady、onShow、onHide、onUnload等方法。我们也可以在App对象中使用生命周期函数，来处理页面之间的共享数据。
/* app.js */
App({
onLaunch() {
wx.login({
success(res) {
wx.request({
url: 'https://example.com/api/login',
data: { code: res.code },
success(res2) {
// 拿到token
getApp().globalData.token = res2.data.token
}
})
}
})
}
})
上面代码中，我们在小程序启动时，调用wx.login方法进行登录，并获取token。需要注意的是，由于wx.login是异步方法，所以我们需要在回调函数中处理数据。
三、总结
在小程序开发中，使用全局配置可以有效地减少重复工作，提高开发效率。全局配置包括了小程序的基本信息、样式、网络请求、页面生命周期等，我们需要根据实际情况选择合适的配置。
尽管全局配置可以极大地简化开发流程，但是我们也需要注意空间，不要在全局配置中添加过多的信息，导致小程序变得过于臃肿。因此，我们需要根据小程序的实际需求，选择合适的配置方式。