该教程示例代码:/lesson04/pages/index/index.js、/lesson04/pages/index/index.wxmlhtml
wx.showLoading用来显示一个loading提示框,但它不提供duration设置,需主动调用 wx.hideLoading 才能关闭提示框,能够经过title属性显示loading文字。前端
wx.showLoading({
title: 'loading'
})
setTimeout(function () {
wx.hideLoading()
}, 2000)
复制代码
wx.showToast方法用来显示一个提示框,title属性可指定显示内容,icon属性指定显示的图标类型,为none时即不显示图标,duration属性用来设置提示框显示的时长。git
wx.showToast({
title: 'toast',
icon: 'none',
duration: 1000
})
复制代码
wx.showActionSheet方法用来显示操做菜单,在itemList属性中指定按钮文案,最大长度为6。github
wx.showActionSheet方法有3种回调方式,分别为success(选中菜单时)、fail(点击取消按钮和背景色)、complete(弹窗收起时),都会传入结果参数,如{errMsg: "showActionSheet:ok", tapIndex: 0}或{errMsg: "showActionSheet:ok", tapIndex: 0}。小程序
wx.showShareMenu方法用于显示当前页的转发按钮,它接受一个withShareTicket参数,为true时会生成一个分享id,能够在小程序后台追踪分享结果。微信小程序
wx.showShareMenu({
withShareTicket: true
})
复制代码
wx.getUserInfo用于获取用户信息,能够在success回调中获取用户信息。api
wx.getUserInfo({
success(res) {
console.log(res)
}
})
复制代码
wx.login方法与wx.getUserInfo方法不一样,它的success回调数据中的code属性是用户的token,如{errMsg: "login:ok", code: "081qfzoj2LluFC0feOlj2gQboj2qfzo5"}。bash
token每次请求返回都不一样,须要将token传到服务端,由服务端经过code2Session接口获取到用户的session_key、openid和unionid,其中是否返回unionid须要看用户的设置。微信
code2Session请求地址为:网络
GET https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code
复制代码
其中须要的APPID和SECRET,能够在小程序的开发设置页面中找到。
code2Session的返回值中,session_key主要用来验证用户身份,请求用户的信息,用户每次登陆时,session_key的值都不一样。
openid是仅在当前小程序中惟一的,当前用户的id,也就是说openid在其余小程序中是不一样的。
unionid指的是开发者的多个公众号和小程序等应用中,对同一个用户的惟一标识。developers.weixin.qq.com/miniprogram…
wx.scanCode方法是用来调用微信的扫码功能,可用scanType属性指定扫码类型,在success回调中接收扫码结果。
wx.scanCode({
scanType: ['barCode', 'qrCode'],
success(res) {
console.log(res) // {errMsg: "scanCode:ok", result: "google", scanType: "QR_CODE", charSet: "UTF-8"}
}
})
复制代码
wx.setKeepScreenOn方法用来使屏幕保持常量状态,可将keepScreenOn参数设置为true,开启保持常量。
wx.setKeepScreenOn({
setKeepScreenOn: true
})
复制代码
wx.setScreenBrightness能够设置屏幕亮度,参数value属性由0~1表示亮度, 0最暗,1最亮。
wx.setScreenBrightness({
value: 1
})
复制代码
wx.getBatteryInfo可用来获取手机点亮,它还有一个同步版本wx.getBatteryInfoSync,在success回调中能够获取数据。
wx.getBatteryInfo({
success(res) {
console.log(res) // {isCharging: false, level: 38, errMsg: "getBatteryInfo:ok"}
}
})
复制代码
wx.connectWifi用来连接WIFI,须要传入WIFI的SSID和password。
wx.connectWifi({
SSID: '',
password: '',
success(res) {
console.log(res.errMsg)
}
})
复制代码
wx.startSoterAuthentication可用来调用微信的生物认证。可在requestAuthModes中传入认证方式,目前仅支持fingerPrint指纹识别。challenge挑战因子属性用于校验调用者身份,将做为 resultJSON 的一部分返回给调用者。
wx.startSoterAuthentication({
requestAuthModes: ['fingerPrint'],
challenge: '123456',
authContent: '请用指纹解锁',
success(res) {
wx.showToast({
title: JSON.stringify(res),
icon: 'none'
})
},
fail(res) {
wx.showToast({
title: JSON.stringify(res),
icon: 'none',
duration: 100000
})
},
})
复制代码
wx.downloadFile将会由客户端直接发起一个 HTTPS GET 请求,可经过url属性指定一个下载地址,经过filePath指定下载后的存储路径。
wx.downloadFile({
url: 'https://cn.bing.com/sa/simg/hpc26i_2x.png',
filePath: 'hpc26i_2x.png',
success(res) {
toast(JSON.stringify(res))
},
fail(res) {
toast(JSON.stringify(res))
},
})
复制代码
wx.startBluetoothDevicesDiscovery方法用来搜索附近的蓝牙设备,在services属性中能够设置要搜索的设备类型。
因为该方法比较消耗系统资源,搜索并连接成功后能够调用wx.stopBluetoothDevicesDiscovery关闭搜索。
wx.startBluetoothDevicesDiscovery({
success(res) {
toast(JSON.stringify(res))
wx.stopBluetoothDevicesDiscovery()
},
fail(res) {
toast(JSON.stringify(res))
},
})
复制代码
wx.request用于网络请求,注意须要将请求的域名设置为合法域名,不然请求会被拦截,在测试时能够在开发工具中选择不校验合法域名。
wx.request({
url: 'https://cn.bing.com/search',
data: { q: 'abc', safe: 'off' },
method: 'get',
dataType: 'text',
success(res) {
toast(JSON.stringify(res))
},
fail(res) {
toast(JSON.stringify(res))
}
})
复制代码
至此,微信小程序教程完结,在我看来,小程序更像是Vue+React+React Native的混合体,有Vue或React相关开发经验的话入门很简单。
但小程序基于微信平台,可以实现传统Web开发不具有的不少功能,并且可以在微信生态圈内发展,做为前端是不能不掌握的重要技能。