小程序的21个新功能
微信的小程序自推出以来就备受用户的关注，它凭借着开发简单、使用便捷、所需空间小等优势一直受到用户的喜爱。最近，小程序又发布了21个新功能，本文将为大家详细介绍这些新功能。
1. 支持桌面图标
随着小程序的普及，官方终于支持了桌面图标的设置，可以更方便地在主屏幕上启动小程序了。需要注意的是，该功能只对Android系统和iOS 13及以上系统生效。
如何设置桌面图标
登录小程序后，点击页面右上角加号，之后点击“添加到桌面”即可。
需要注意的是，对于安卓手机，每个小程序都需要手动设置桌面图标，而对于iOS手机，则只需要设置一次即可。
2. 支持数据字典缓存
在小程序中，支持了数据字典的缓存，可以通过定义一个js文件来将数据字典保存到缓存中，并且实现简单，加载速度也快，可以提高小程序的用户体验。
如何实现数据字典缓存
所有需要缓存的数据都可以保存在一个js文件中，使用JS的key-value结构保存数据。定义一个cache对象，在对象上添加所有key/value对即可。例如，下面的代码实现了一个按月份缓存账单的例子：
```
const cache = {};
const now = new Date();
const month = now.getMonth() + 1;
const year = now.getFullYear();
if (!cache['bill']) {
cache['bill'] = {};
}
if (!cache['bill'][year]) {
cache['bill'][year] = {};
}
if (!cache['bill'][year][month]) {
cache['bill'][year][month] = {};
}
cache['bill'][year][month] = data;
```
3. 支持跳转到其他小程序
新版小程序新增了“跳转到其他小程序”的功能，跳转到其他小程序后，用户可以直接使用跳转后的小程序中提供的内容，大大简化了用户操作。
如何跳转到其他小程序
使用wx.navigateToMiniProgram方法，传入其他小程序的AppID和路径即可。例如：
wx.navigateToMiniProgram({
appId: '其他小程序的AppID',
path: '其他小程序内页面路径',
success(res) {console.log(res)}
})
4. 支持小程序订阅消息功能
小程序支持订阅消息功能，可以让用户获得个性化、实时的信息推送，例如物流更新、订单状态、活动即将开始等。
如何使用小程序订阅消息功能
需要用户授权，并在授权成功后将授权加入数据库，之后通过server api调用模板消息即可实现推送。例如：
wx.requestSubscribeMessage({
tmplIds: ['', ''],// 模板id，可以通过微信公众平台后台申请
success(res) {}
})
5. 支持小程序直播功能
在新版小程序中，支持了小程序直播功能。可以在小程序内直接连麦、发弹幕，与主播互动。
如何使用小程序直播功能
使用wx.request方法获取拉流地址，再通过wx.createLivePlayerContext方法实现直播功能。例如：
wx.request({
url: '拉流地址',
success(res) {
var context = wx.createLivePlayerContext('player')
context.play()
}
})
6. 支持小程序插件功能
新版小程序支持小程序插件功能，可以将所需功能和数据通过小程序插件实现。在使用过程中，可以通过插件来获取数据和功能。
如何使用小程序插件功能
需要通过微信公众平台后台申请小程序插件ID，之后在小程序中使用插件即可。例如，获取微信运动数据的插件e都有：
wx.getWeRunData({// 获取微信运动数据
success(res) {
const encryptedData = res.encryptedData
const iv = res.iv
const e = new regeneratorRuntime.WX({// 插件ID
api: "xxx",
token: "xxx"
});
e.getWeRunData({
data: {
encryptedData: encryptedData,
iv: iv
},
success(res) {
console.log(res)
}
})
}
})
7. 支持小程序开放数据卡片接口
新版小程序支持小程序开放数据卡片接口，可以让用户将小程序内的数据在微信朋友圈或者微信群内分享。
如何使用小程序开放数据卡片接口
使用wx.updateShareMenu方法实现开放数据卡片接口，并在分享时传递card参数即可。例如：
wx.updateShareMenu({
withShareTicket: true,
success() {
wx.shareAppMessage({
title: '标题',
path: '路径',
imageUrl: '图片地址',
success: function(res) {
if (res.shareTickets) {
var shareTicket = res.shareTickets[0]
wx.getShareInfo({
shareTicket: shareTicket,
success(res) {
var encryptedData = res.encryptedData
var iv = res.iv
wx.openDataCard({
cardList: [{
openGId: "",
cardId: "",
cardExt: "encryptedData=" + encodeURIComponent(encryptedData) + "&iv=" + encodeURIComponent(iv)
}]
})
}
})
}
}
})
}
})
8. 支持小程序云开发
新版小程序中支持了小程序云开发功能，可以在小程序内使用数据库、云函数、云存储等功能，更加方便了开发人员的使用。
如何使用小程序云开发
需要在小程序后台开启云开发功能，之后创建数据集合，就可以开始操作数据库了。例如，获取云数据库数据：
wx.cloud.database().collection('user').get({
success(res) {
console.log(res)
}
})
9. 支持小程序音视频功能
新版小程序中支持小程序音视频功能，开发人员可以在小程序中实现录音和播放音频、视频等功能，为开发人员提供了更多的选择。
如何使用小程序音视频功能
可以通过wx.chooseVideo、wx.startRecord和wx.playVoice等方法实现音视频功能。例如，录制音频的方法：
var recordStatus = false
var interval
wx.startRecord({
success() {
recordStatus = true
clearInterval(interval)
},
fail: function() {
recordStatus = false
}
})
interval = setInterval(function() {
if (recordStatus) {
wx.stopRecord()
clearInterval(interval)
}
}, 1000)
10. 支持管理系统消息
在新版小程序中，支持管理系统消息，随时查看和处理系统消息，方便维护系统。
如何管理小程序系统消息
所有系统消息都会显示在开发者工具中的问题反馈管理页面，可以通过该页面查看和处理系统消息。
11. 支持小程序分享功能
新版小程序中支持小程序分享功能，可以让用户分享小程序内的内容。
如何分享小程序内容
需要在页面右上角显示出分享按钮，当用户点击分享按钮，会自动调用wx.shareAppMessage方法。可以在该方法中设置分享的标题、路径和图片等相关参数，例如：
wx.showShareMenu({
withShareTicket: true,
success(res) {
console.log("设置成功！")
}
})
wx.onShareAppMessage(function() {
return {
title: '标题',
path: '路径',
imageUrl: '图片地址',
success: function(res) {
console.log(res)
}
}
})
12. 支持加载网络字体
新版小程序支持加载网络字体，可以使小程序更加美观、个性化，提高小程序的用户体验。
如何加载网络字体
可以通过@font-face语法导入网络字体文件，例如：
@font-face {
font-family: 'MyFont';
src: url('http://example.com/myfont.woff2') format("woff2"), url('http://example.com/myfont.woff') format("woff");
font-weight: 400;
font-style: normal;
}
13. 支持自定义组件化开发
新版小程序支持自定义组件化开发，可以将重复的代码和样式抽离出来，方便代码的维护。
如何开发自定义组件
在使用前需要在app.json中配置，注册组件。可以在组件中定义模板和样式，然后将组件注册到页面中即可，例如：
Component({
properties: {
//组件的属性列表
text: {
type: String,
value: ''
},
color: {
type: String,
value: ''
}
},
methods: {
//组件的方法列表
}
})
14. 支持小程序离线缓存功能
新版小程序支持小程序离线缓存功能，可以在小程序离线时快速读取缓存的数据，方便用户的操作。
如何开启小程序离线缓存功能
需要在app.json中配置离线缓存需要缓存的页面列表，例如：
{
"pages": [
"pages/index/index",
"pages/logs/logs",
"pages/detail/detail"
],
"networkTimeout": {
"request": 10000,
"downloadFile": 10000
},
"window": {
"backgroundTextStyle": "light",
"navigationBarBackgroundColor": "#fff",
"navigationBarTitleText": "小程序名称",
"navigationBarTextStyle": "black"
},
"tabBar": {
"color": "#666",
"selectedColor": "#b4282d",
"backgroundColor": "#fafafa",
"borderStyle": "white",
"list": [
{
"pagePath": "pages/index/index",
"text": "首页",
"iconPath": "images/index.png",
"selectedIconPath": "images/index-selected.png"
},
{
"pagePath": "pages/logs/logs",
"text": "日志",
"iconPath": "images/logs.png",
"selectedIconPath": "images/logs-selected.png"
}
]
},
"app": {
"backgroundTextStyle": "light",
"navigationBarBackgroundColor": "#fff",
"navigationBarTitleText": "小程序名称",
"navigationBarTextStyle": "black"
},
"offline": {
"pages": [
"pages/index/index",
"pages/logs/logs",
"pages/detail/detail"
]
}
}
15. 支持小程序自定义导航栏
在新版小程序中，可以实现自定义导航栏，使用者可以根据自己的需求来定制小程序的导航栏。
如何实现自定义导航栏
需要在app.json中进行配置，实现自定义导航栏。例如：
{
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black",
"navigationBarTitleText": "小程序名称",
"enablePullDownRefresh": true,
"usingComponents": {
"nav-bar": "/components/nav-bar/nav-bar"
}
}
16. 支持小程序极速发布功能
新版小程序新增了极速发布功能，可以在小程序开发完成后快速发布。
如何使用极速发布功能
只需要在小程序后台中选择极速发布功能，并绑定可信域名，即可快速发布。
17. 支持小程序云存储功能
在新版小程序中，新增了小程序云存储功能，可以让开发人员在小程序中进行数据存储，为开发人员提供了更方便的使用。
如何使用小程序云存储功能
需要在小程序后台开启云开发功能，之后就可以对云存储进行操作了。例如，上传文件：
wx.cloud.uploadFile({
cloudPath: "路径",
filePath: "本地文件路径",
success(res) {
console.log(res)
}
})
18. 支持获取当前用户地理位置
在新版小程序中，支持获取当前用户地理位置，可以方便地进行地理位置定位。
如何获取当前用户地理位置
需要在小程序中使用wx.getLocation方法获取当前用户地理位置。例如：
wx.getLocation({
type: 'wgs84',
success(res) {
const latitude = res.latitude
const longitude = res.longitude
const speed = res.speed
const accuracy = res.accuracy
}
})
19. 支持小程序推送服务
新版小程序中新增了小程序推送服务，可以进行即时推送，方便用户获取最新的信息。
如何使用小程序推送服务
需要在小程序后台通过模板消息设置进行配置推送类型和内容，并通过server api调用模板消息即可。例如：
wx.requestSubscribeMessage({
tmplIds: ['', ''],// 模板id，可以通过微信公众平台后台申请
success(res) {}
})