文章目录
1.网络请求相关API1.1 wx.request1.2 wx.uploadFile1.3 wx.downloadFile1.4 wx.connectSocket 2.页面跳转相关API2.1 wx.navigateTo2.2 wx.redirectTo2.3 wx.reLaunch2.4 wx.navigateBack 3.数据缓存相关API3.1 wx.getStorageSync3.2 wx.setStorageSync3.3 wx.clearStorageSync 4.交互反馈相关API4.1 wx.showToast4.2 wx.showLoading4.3 wx.hideToast4.4 wx.hideLoading 5.设备相关API5.1 wx.getSystemInfo5.2 wx.getNetworkType5.3 wx.getBatteryInfo5.4 wx.vibrateShort 6.媒体相关API6.1 wx.chooseImage6.2 wx.previewImage6.3 wx.chooseVideo6.4 wx.createCameraContext 7.界面相关API7.1 wx.navigateTo7.2 wx.redirectTo7.3 wx.switchTab7.4 wx.navigateBack 8.开放接口相关API8.1 wx.login8.2 wx.getUserInfo8.3 wx.requestPayment 总结写在最后微信小程序提供了丰富的API,以下是全部常用API的介绍、示例代码和使用场景:
1.网络请求相关API
1.1 wx.request
API介绍:发起网络请求,可以用来获取服务器数据。
示例代码:
wx.request({ url: 'https://api.example.com/data', success(res) { console.log(res.data) }})
使用场景:当小程序需要向服务器请求数据时,可以使用该API。
1.2 wx.uploadFile
API介绍:上传文件。
示例代码:
wx.uploadFile({ url: 'https://api.example.com/upload', filePath: 'filePath', name: 'file', success(res) { console.log(res.data) }})
使用场景:当小程序需要上传文件时,可以使用该API。
1.3 wx.downloadFile
API介绍:下载文件。
示例代码:
url: 'https://example.com/image', success(res) { console.log(res.tempFilePath) }})
使用场景:当小程序需要下载文件时,可以使用该API。
1.4 wx.connectSocket
API介绍:创建 WebSocket 连接。
示例代码:
wx.connectSocket({ url: 'wss://example.com/socket', success() { console.log('WebSocket 连接成功') }})
使用场景:当小程序需要使用 WebSocket 进行实时通讯时,可以使用该API。
2.页面跳转相关API
2.1 wx.navigateTo
API介绍:用于跳转到应用内的页面。
示例代码:
wx.navigateTo({ url: '/pages/detail/detail?id=123'})
使用场景:当用户点击列表项时,跳转到该项的详情页面。
2.2 wx.redirectTo
API介绍:关闭当前页面,跳转到应用内的某个页面。
示例代码:
url: '/pages/index/index'})
使用场景:当用户提交表单后,跳转到成功页面。
2.3 wx.reLaunch
API介绍:关闭所有页面,打开应用内的某个页面。
示例代码:
wx.reLaunch({ url: '/pages/index/index'})
使用场景:当用户点击首页按钮时,关闭所有页面,返回首页。
2.4 wx.navigateBack
API介绍:关闭当前页面,返回上一页面或多级页面。
示例代码:
wx.navigateBack({ delta: 1})
使用场景:当用户点击返回按钮时,返回上一页面。
3.数据缓存相关API
3.1 wx.getStorageSync
API介绍:从本地缓存中获取数据。
示例代码:
let value = wx.getStorageSync('key')
使用场景:当小程序需要从本地缓存中获取数据时,可以使用该API。
3.2 wx.setStorageSync
API介绍:将数据存储到本地缓存中。
示例代码:
wx.setStorageSync('key', 'value')
使用场景:当小程序需要将数据存储到本地缓存中时,可以使用该API。
3.3 wx.clearStorageSync
API介绍:清空本地缓存。
示例代码:
wx.clearStorageSync()
使用场景:当小程序需要清空本地缓存时,可以使用该API。
4.交互反馈相关API
4.1 wx.showToast
API介绍:显示消息提示框。
示例代码:
wx.showToast({ title: '操作成功', icon: 'success'})
使用场景:当小程序需要在操作成功后给用户提示时,可以使用该API。
4.2 wx.showLoading
API介绍:显示 loading 提示框。
示例代码:
wx.showLoading({ title: '加载中'})
使用场景:当小程序需要在加载数据时给用户提示时,可以使用该API。
4.3 wx.hideToast
API介绍:隐藏消息提示框。
示例代码:
wx.hideToast()
使用场景:当小程序需要隐藏消息提示框时,可以使用该API。
4.4 wx.hideLoading
API介绍:隐藏 loading 提示框。
示例代码:
wx.hideLoading()
使用场景:当小程序需要隐藏 loading 提示框时,可以使用该API。
5.设备相关API
5.1 wx.getSystemInfo
API介绍:获取系统信息。
示例代码:
wx.getSystemInfo({ success(res) { console.log(res.platform) }})
使用场景:当小程序需要获取系统信息时,可以使用该API。
5.2 wx.getNetworkType
API介绍:获取网络类型。
示例代码:
wx.getNetworkType({ success(res) { console.log(res.networkType) }})
使用场景:当小程序需要获取当前网络类型时,可以使用该API。
5.3 wx.getBatteryInfo
API介绍:获取设备电量信息。
示例代码:
wx.getBatteryInfo({ success(res) { console.log(res.level) }})
使用场景:当小程序需要获取设备电量信息时,可以使用该API。
5.4 wx.vibrateShort
API介绍:使手机振动。
示例代码:
wx.vibrateShort()
使用场景:当小程序需要在用户操作时给出震动反馈时,可以使用该API。
6.媒体相关API
6.1 wx.chooseImage
API介绍:从相册或相机中选择图片或视频。
示例代码:
wx.chooseImage({ count: 1, success(res) { console.log(res.tempFilePaths) }})
使用场景:当小程序需要获取用户选择的图片或视频时,可以使用该API。
6.2 wx.previewImage
API介绍:预览图片。
示例代码:
wx.previewImage({ urls: ['https://example.com/image.jpg']})
使用场景:当小程序需要预览图片时,可以使用该API。
6.3 wx.chooseVideo
API介绍:从相册或相机中选择视频。
示例代码:
wx.chooseVideo({ sourceType: ['album', 'camera'], success(res) { console.log(res.tempFilePath) }})
使用场景:当小程序需要获取用户选择的视频时,可以使用该API。
6.4 wx.createCameraContext
API介绍:创建 camera 上下文 CameraContext 对象。
示例代码:
const cameraContext = wx.createCameraContext()cameraContext.takePhoto({ success(res) { console.log(res.tempImagePath) }})
使用场景:当小程序需要在页面上显示相机组件并进行拍照时,可以使用该API。
7.界面相关API
7.1 wx.navigateTo
API介绍:保留当前页面,跳转到应用内的某个页面。
示例代码:
wx.navigateTo({ url: '/pages/detail/detail'})
使用场景:当小程序需要跳转到其他页面时,可以使用该API。
7.2 wx.redirectTo
API介绍:关闭当前页面,跳转到应用内的某个页面。
示例代码:
wx.redirectTo({ url: '/pages/index/index'})
使用场景:当小程序需要关闭当前页面并跳转到其他页面时,可以使用该API。
7.3 wx.switchTab
API介绍:跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面。
示例代码:
wx.switchTab({ url: '/pages/index/index'})
使用场景:当小程序需要跳转到 tabBar 页面时,可以使用该API。
7.4 wx.navigateBack
API介绍:关闭当前页面,返回上一页面或多级页面。
示例代码:
wx.navigateBack({ delta: 1})
使用场景:当小程序需要返回上一页面或多级页面时,可以使用该API。
8.开放接口相关API
8.1 wx.login
API介绍:调用接口获取登录凭证(code)。
示例代码:
wx.login({ success(res) { console.log(res.code) }})
使用场景:当小程序需要获取用户登录凭证时,可以使用该API。
8.2 wx.getUserInfo
API介绍:获取用户信息。
示例代码:
wx.getUserInfo({ success(res) { console.log(res.userInfo) }})
使用场景:当小程序需要获取用户信息时,可以使用该API。
8.3 wx.requestPayment
API介绍:发起微信支付。
示例代码:
wx.requestPayment({ timeStamp: '', nonceStr: '', package: '', signType: 'MD5', paySign: '', success(res) { }, fail(res) { }})
使用场景:当小程序需要发起微信支付时,可以使用该API。
总结
以上是微信小程序常用API的介绍和示例代码,这些API包括网络请求、数据缓存、交互反馈、设备、媒体、界面、开放接口等方面,可以帮助开发者快速实现各种功能和交互效果。当然,实际开发中,开发者还需要根据具体需求选择合适的API来使用。
希望本文对初学者有所帮助,如果有任何问题或建议,欢迎留言讨论。