218 lines
4.2 KiB
Markdown
218 lines
4.2 KiB
Markdown
|
|
# 微信小程序 API 速查
|
|||
|
|
|
|||
|
|
## 路由导航
|
|||
|
|
|
|||
|
|
```javascript
|
|||
|
|
// 保留当前页跳转(最多10层)
|
|||
|
|
wx.navigateTo({
|
|||
|
|
url: '/pages/detail/detail?id=123',
|
|||
|
|
success(res) {
|
|||
|
|
res.eventChannel.emit('sendData', { data: 'hello' })
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
// 被打开页接收
|
|||
|
|
onLoad() {
|
|||
|
|
this.getOpenerEventChannel().on('sendData', data => {})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 关闭当前页跳转
|
|||
|
|
wx.redirectTo({ url: '/pages/other/other' })
|
|||
|
|
|
|||
|
|
// 关闭所有页面
|
|||
|
|
wx.reLaunch({ url: '/pages/index/index' })
|
|||
|
|
|
|||
|
|
// 返回
|
|||
|
|
wx.navigateBack({ delta: 1 })
|
|||
|
|
|
|||
|
|
// TabBar页面
|
|||
|
|
wx.switchTab({ url: '/pages/home/home' })
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
## 数据存储
|
|||
|
|
|
|||
|
|
```javascript
|
|||
|
|
// 同步
|
|||
|
|
wx.setStorageSync('key', { name: 'value' })
|
|||
|
|
const data = wx.getStorageSync('key')
|
|||
|
|
wx.removeStorageSync('key')
|
|||
|
|
|
|||
|
|
// 异步
|
|||
|
|
wx.setStorage({ key: 'key', data: value, encrypt: true })
|
|||
|
|
wx.getStorage({ key: 'key', success(res) { console.log(res.data) } })
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
## 网络请求
|
|||
|
|
|
|||
|
|
```javascript
|
|||
|
|
wx.request({
|
|||
|
|
url: 'https://api.example.com/data',
|
|||
|
|
method: 'POST',
|
|||
|
|
data: { id: 1 },
|
|||
|
|
header: { 'Authorization': 'Bearer token' },
|
|||
|
|
timeout: 10000,
|
|||
|
|
success(res) { console.log(res.data) },
|
|||
|
|
fail(err) { console.error(err) }
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
// 上传
|
|||
|
|
wx.uploadFile({
|
|||
|
|
url: 'https://api.example.com/upload',
|
|||
|
|
filePath: tempFilePath,
|
|||
|
|
name: 'file',
|
|||
|
|
formData: { userId: '123' }
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
// 下载
|
|||
|
|
wx.downloadFile({
|
|||
|
|
url: 'https://example.com/file.pdf',
|
|||
|
|
success(res) { wx.openDocument({ filePath: res.tempFilePath }) }
|
|||
|
|
})
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
## 用户授权
|
|||
|
|
|
|||
|
|
```javascript
|
|||
|
|
// 登录
|
|||
|
|
wx.login({ success(res) { /* 发送 res.code 到后端 */ } })
|
|||
|
|
|
|||
|
|
// 获取手机号(button触发)
|
|||
|
|
// <button open-type="getPhoneNumber" bindgetphonenumber="onGetPhone">
|
|||
|
|
onGetPhone(e) {
|
|||
|
|
if (e.detail.code) { /* 发送code到后端解密 */ }
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 检查授权
|
|||
|
|
wx.getSetting({ success(res) {
|
|||
|
|
if (res.authSetting['scope.userLocation']) { /* 已授权 */ }
|
|||
|
|
}})
|
|||
|
|
|
|||
|
|
// 请求授权
|
|||
|
|
wx.authorize({ scope: 'scope.userLocation' })
|
|||
|
|
|
|||
|
|
// 打开设置
|
|||
|
|
wx.openSetting()
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
## 支付
|
|||
|
|
|
|||
|
|
```javascript
|
|||
|
|
wx.requestPayment({
|
|||
|
|
timeStamp: '', // 后端返回
|
|||
|
|
nonceStr: '', // 后端返回
|
|||
|
|
package: '', // prepay_id
|
|||
|
|
signType: 'RSA',
|
|||
|
|
paySign: '', // 后端返回
|
|||
|
|
success() { console.log('支付成功') },
|
|||
|
|
fail(err) {
|
|||
|
|
if (err.errMsg.includes('cancel')) { /* 取消 */ }
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
## 媒体
|
|||
|
|
|
|||
|
|
```javascript
|
|||
|
|
// 选择图片/视频
|
|||
|
|
wx.chooseMedia({
|
|||
|
|
count: 9,
|
|||
|
|
mediaType: ['image', 'video'],
|
|||
|
|
sourceType: ['album', 'camera'],
|
|||
|
|
success(res) { console.log(res.tempFiles) }
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
// 预览图片
|
|||
|
|
wx.previewImage({ current: url, urls: imageList })
|
|||
|
|
|
|||
|
|
// 保存到相册
|
|||
|
|
wx.saveImageToPhotosAlbum({ filePath: path })
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
## 位置
|
|||
|
|
|
|||
|
|
```javascript
|
|||
|
|
// 获取位置
|
|||
|
|
wx.getLocation({
|
|||
|
|
type: 'gcj02',
|
|||
|
|
isHighAccuracy: true,
|
|||
|
|
success(res) { const { latitude, longitude } = res }
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
// 选择位置
|
|||
|
|
wx.chooseLocation({ success(res) { /* name, address, lat, lng */ } })
|
|||
|
|
|
|||
|
|
// 打开地图
|
|||
|
|
wx.openLocation({ latitude, longitude, name: '位置', scale: 18 })
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
## 界面交互
|
|||
|
|
|
|||
|
|
```javascript
|
|||
|
|
// Toast
|
|||
|
|
wx.showToast({ title: '成功', icon: 'success', duration: 2000 })
|
|||
|
|
wx.showLoading({ title: '加载中', mask: true })
|
|||
|
|
wx.hideLoading()
|
|||
|
|
|
|||
|
|
// Modal
|
|||
|
|
wx.showModal({
|
|||
|
|
title: '提示',
|
|||
|
|
content: '确定删除?',
|
|||
|
|
success(res) { if (res.confirm) { /* 确定 */ } }
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
// ActionSheet
|
|||
|
|
wx.showActionSheet({
|
|||
|
|
itemList: ['选项1', '选项2'],
|
|||
|
|
success(res) { console.log(res.tapIndex) }
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
// 导航栏
|
|||
|
|
wx.setNavigationBarTitle({ title: '标题' })
|
|||
|
|
|
|||
|
|
// TabBar
|
|||
|
|
wx.setTabBarBadge({ index: 0, text: '99' })
|
|||
|
|
wx.showTabBarRedDot({ index: 0 })
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
## 自定义组件
|
|||
|
|
|
|||
|
|
```javascript
|
|||
|
|
Component({
|
|||
|
|
options: { multipleSlots: true, styleIsolation: 'isolated' },
|
|||
|
|
|
|||
|
|
properties: {
|
|||
|
|
title: { type: String, value: '' },
|
|||
|
|
data: { type: Object, observer(val) { this.process(val) } }
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
data: { internal: null },
|
|||
|
|
|
|||
|
|
observers: { 'data.status': function(status) { } },
|
|||
|
|
|
|||
|
|
lifetimes: {
|
|||
|
|
attached() { },
|
|||
|
|
detached() { }
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
methods: {
|
|||
|
|
handleTap() {
|
|||
|
|
this.triggerEvent('click', { id: this.data.data.id })
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
## Behaviors
|
|||
|
|
|
|||
|
|
```javascript
|
|||
|
|
// behavior.js
|
|||
|
|
module.exports = Behavior({
|
|||
|
|
properties: { commonProp: String },
|
|||
|
|
data: { commonData: '' },
|
|||
|
|
methods: { commonMethod() { } }
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
// 组件中使用
|
|||
|
|
Component({ behaviors: [require('./behavior')] })
|
|||
|
|
```
|