文章目录

  • 1.网络请求相关API
    • 1.1 wx.request
    • 1.2 wx.uploadFile
    • 1.3 wx.downloadFile
    • 1.4 wx.connectSocket
  • 2.页面跳转相关API
    • 2.1 wx.navigateTo
    • 2.2 wx.redirectTo
    • 2.3 wx.reLaunch
    • 2.4 wx.navigateBack
  • 3.数据缓存相关API
    • 3.1 wx.getStorageSync
    • 3.2 wx.setStorageSync
    • 3.3 wx.clearStorageSync
  • 4.交互反馈相关API
    • 4.1 wx.showToast
    • 4.2 wx.showLoading
    • 4.3 wx.hideToast
    • 4.4 wx.hideLoading
  • 5.设备相关API
    • 5.1 wx.getSystemInfo
    • 5.2 wx.getNetworkType
    • 5.3 wx.getBatteryInfo
    • 5.4 wx.vibrateShort
  • 6.媒体相关API
    • 6.1 wx.chooseImage
    • 6.2 wx.previewImage
    • 6.3 wx.chooseVideo
    • 6.4 wx.createCameraContext
  • 7.界面相关API
    • 7.1 wx.navigateTo
    • 7.2 wx.redirectTo
    • 7.3 wx.switchTab
    • 7.4 wx.navigateBack
  • 8.开放接口相关API
    • 8.1 wx.login
    • 8.2 wx.getUserInfo
    • 8.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来使用。

希望本文对初学者有所帮助,如果有任何问题或建议,欢迎留言讨论。

写在最后

✨原创不易,希望各位大佬多多支持。

【小程序开发必备】微信小程序常用API全介绍,附示例代码和使用场景相关推荐

  1. core和node开发小程序_成都小程序开发:微信小程序开发要多少钱?

    定制开发一个微信小程序要多少钱呢? 成都小程序开发需要多少钱,成都小程序定制多少钱,成都小程序开发获得报价 微信小程序背靠腾讯的亿级流量,有着非常强大的线上引流功能,目前微信小程序的开发越来越火爆,选 ...

  2. 微信小程序开发:微信小程序生命周期总结

    前言 在微信小程序开发中,关于微信小程序API的使用是必备技能,但是关于微信小程序的生命周期也是首先要了解和掌握的知识点.尤其是现在的前端开发领域,关于前端的各种框架和技术都要会,而且微信小程序的语法 ...

  3. 微信小程序开发教程||微信小程序 小程序简介||微信小程序 开始||微信小程序 小程序代码构成

    微信小程序 小程序简介 小程序简介 小程序是一种全新的连接用户与服务的方式,它可以在微信内被便捷地获取和传播,同时具有出色的使用体验. 小程序技术发展史 ​小程序并非凭空冒出来的一个概念.当微信中的 ...

  4. 小程序嵌套h5页面_快速小程序开发之微信小程序内嵌 H5

    简介:微信小程序中可以直接运行 web 页面,这一新组件 web-view 的产生,可能直接导致小程序数量迎来一波高峰.本篇博文将从业务选型,微信小程序后台配置,使用 web-view 完成登录业务以 ...

  5. 微信小程序开发教程-微信小程序入门

    转自http://blog.jobbole.com/106049/ 微信应用号(小程序,「应用号」的新称呼)终于来了! 目前还处于内测阶段,微信只邀请了部分企业参与封测.想必大家都关心「小程序」的最终 ...

  6. php小程序开发实例,微信小程序全局配置开发实例

    本文主要和大家分享微信小程序全局配置开发实例,主要以代码的形式和大家分享,希望能帮助到大家. 一.app.json 使用app.json文件来对微信小程序进行全局配置,决定页面文件的路径.窗口表现.设 ...

  7. 微信小程序开发|基于微信小程序的健身陪练系统的设计与实现

    作者主页:编程指南针 作者简介:Java领域优质创作者.CSDN博客专家 .CSDN内容合伙人.掘金特邀作者.阿里云博客专家.51CTO特邀作者.多年架构师设计经验.腾讯课堂常驻讲师 主要内容:Jav ...

  8. 基于mpvue框架的仿酷狗音乐小程序开发的微信小程序(Robot Music)

    1. 项目实现 由于是小程序未认证所以只能添加体验者才能预览 项目github地址:https://github.com/historytiger/wx- 请下载放开发者工具食用 数据来源于网络大佬免 ...

  9. 【小程序开发】微信小程序开发中遇到的那些坑...

    第一坑: 设置了三个tabBar,却默认显示第二个,不能展示我的第一个[首页]. "list": [{"pagePath":"page/KTGJ/in ...

最新文章

  1. 【算法总结】数学问题-最大公约数和最小公倍数
  2. 管理敏捷迭代任务和任务协作
  3. arm ida 伪代码 安卓 符号表_IDA调试界面介绍及快捷键
  4. svm分类代码_当支持向量机遇上神经网络:SVM、GAN距离之间的关系
  5. ​​​​​​​DL之ResNeXt:ResNeXt算法的架构详解
  6. 波卡链Substrate (7)Grandpa协议三“2阶段同步”
  7. 大数据WEB阶段Spring框架(一)IOC控制反转、DI注入依赖
  8. 操作多台_一支热电偶能否连接多台显示仪表
  9. 音视频开发(31)---H.264格式分析
  10. opencv学习笔记02
  11. 与计算机专业相关的英语科普短文,英语科普文选-中英文对照(计算机.doc
  12. FTP服务器windows配置
  13. MDM数据质量应用说明
  14. javaweb mysql毕业生管理系统_javaweb高校毕业生就业管理系统, springmvc+mysql
  15. C#调用报表生成器成功案例示例研究
  16. IPSec在企业网络中的应用
  17. php中eregi,PHP 函数 eregi()
  18. python母亲节代码_python 计算 母亲节
  19. 阿里技术专家甘盘:浅谈双十一背后的支付宝LDC架构和其CAP分析(含phil补充)
  20. 无线蓝牙耳机哪个品牌好?蓝牙降噪耳机品牌推荐

热门文章

  1. 共享单车与蓝牙的关系
  2. django channels
  3. grep与egrep
  4. Excel如何批量间隔删除指定行
  5. 网页直播英文版上线,跨国企业客户用着很酷哇
  6. pinpoint安装及介绍
  7. webSql简单探究
  8. 2011年及中长期要实现的目标
  9. Flutter拖拽控件Draggable
  10. 人生,切忌不要做这些事!