【小程序开发必备】微信小程序常用API全介绍,附示例代码和使用场景_微信小程序代码大全-程序员宅基地

技术标签: 微信小程序  前端  小程序  小程序常用api  小程序从入门到精通  


在这里插入图片描述

创作者:全栈弄潮儿
个人主页: 全栈弄潮儿的个人主页
️ 个人社区,欢迎你的加入:全栈弄潮儿的个人社区
专栏地址:小程序从入门到精通
在这里插入图片描述

人工智能福利文章

微信小程序提供了丰富的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来使用。

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

脑筋急转弯小程序抢先体验

请添加图片描述

程序员专属工具箱

请添加图片描述

创作不易,求关注,点赞,收藏️

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/u010494753/article/details/129988306

智能推荐

CDH配置hive.exec.dynamic.partition.mode_cdh hive.exec.dynamic.partition.mode-程序员宅基地

文章浏览阅读904次。cdh配置hive.exec.dynamic.partition.mode看图说话,我是用的server2,所以根据自己情况配置_cdh hive.exec.dynamic.partition.mode

matlab print用法,使用Matlab:错误使用 mprint (line 231) Wrong # rnames in mprint,怎么解决...-程序员宅基地

文章浏览阅读813次。请问大牛们:在使用Matlab:错误使用 mprint (line 231) Wrong # rnames in mprint,怎么解决?程序如下:T=12;N=10;W=normw(W1);y=A(:,[23]);x=A(:,[17:22]);for t=1:Tt1=(t-1)*N+1;t2=t*N;wx(t1:t2,:)=W*x(t1:t2,:);endxconstant=ones(N*T,1..._matlab print报错

Java substring用法_java substring的用法-程序员宅基地

文章浏览阅读467次。public String substring(int beginIndex, int endIndex)返回一个新字符串,它是此字符串的一个子字符串。该子字符串从指定的 beginIndex 处开始,一直到索引 endIndex - 1 处的字符。因此,该子字符串的长度为 endIndex-beginIndex。示例: "ham_java substring的用法

fopen,fopen_s,_wfopen_s与_fsopen, _wfsopen的区分_fopen_s和fopen的区别-程序员宅基地

文章浏览阅读1.5w次,点赞2次,收藏13次。C++做项目的过程中,需要实现文件打开保存的一个功能,当我对文件tmp.dat进行写操作以后,想要第二次对此文件进行写操作,此时用fopen_s,_wfopen_s均出现返回int error = 13也就是EACCES (Permission denied)的错误。而由于项目是Unicode编码,没办法用fopen进行文件操作(其实只要在预编译中加入_CRT_SECURE_NO_WARN_fopen_s和fopen的区别

合工大计算机组成原理ppt,合工大 计算机组成原理 计算机组成原理提纲.pdf-程序员宅基地

文章浏览阅读251次。合工大 计算机组成原理 计算机组成原理提纲计算机组成原理计算机组成原理合肥工业大学计算机与信息学院陈陈 田田2013.12.12提 纲11 考试形式和试卷结构考试形式和试卷结构2 考查目标3 参考书目44 考点及重点难点分析考点及重点难点分析计算机与信息学院 ..._计算机组成原理合工大

PostgreSQL--读懂执行计划(一)_postgresql 执行计划-程序员宅基地

文章浏览阅读7.9k次,点赞5次,收藏42次。这里写自定义目录标题前言执行计划常用命令参数解读常用组合执行计划解读关键字常见扫描方式Seq ScanIndex Only ScanIndex ScanBitmap Index Scan+Bitmap Heap ScanHash JoinNested LoopMerge Join小结前言PostgreSQL为每个收到查询产生一个查询计划。 选择正确的计划来匹配查询结构和数据的属性对于好的性能来说绝对是最关键的,因此系统包含了一个复杂的规划器来尝试选择好的计划。 你可以使用EXPLAIN命令察看规划器为任_postgresql 执行计划

随便推点

DB2插入引号字符的问题_db2单引号入库-程序员宅基地

文章浏览阅读2.8k次。 对于需要插入引号字符的问题,可以通过下面的方法解决:   1. 如果需要输入单引号,可以连续输入两个单引号, 则会插入一个单引号到表中, 第一个单引号会被作为转义符, 如:  db2 insert into sales(region) values()  则会插入一个单引号到字段region中。  db2 insert into sales(region) value_db2单引号入库

(三)k8s----etcd运行机制,数据备份/恢复-程序员宅基地

文章浏览阅读348次。文章目录三. etcd运行机制启动脚本参数查看成员信息验证当前etcd所有成员状态查看etcd数据信息etcd增删改查数据etcd数据watch机制四. etcd数据备份与恢复机制etcd v3版本数据备份与恢复五. 网络通信机制--CNI1. calico查看pod路由走向=2. flannelflannel pod状态VxLAN Directrouting=Flannel不同node上的pod的通信流程三. etcd运行机制etcd是CoreOS团队于2013年6月发起的开源项目,它的目标是构建一个

在ubuntu 环境安装qt出现的问题_make warning qconfig.pri-程序员宅基地

文章浏览阅读1k次。1. 第一个QT问题: has modification time 18271224 s in the future具体问题如下图和文字:/Qt5.5.0/5.5/gcc_64/mkspecs/qconfig.pri’ has modification time 18271224 s in the future问题原因:qconfig.pri’ has modification time 18271224 s in the future 这句话中文意思就是qconfig.pri 文件的时间比较早_make warning qconfig.pri

使用logger日志将操作记录写入数据库_logge日志怎么写入数据库-程序员宅基地

文章浏览阅读8.6k次,点赞4次,收藏15次。之前做的一个项目有这么个要求,在日志管理系统里,需要将某些日志信息存储到数据库里,供用户、管理员查看分析。因此我就花了点时间搞了一下这一功能。说白了就是在用户在调用某接口的时候,相应的会在数据库进行保存,是谁对什么做了什么样的操作,要写明白,在这里使用spring提供的AOP来将切面类织入个个接口中,话不多说,直接上代码public class LogAspect {//自定义一个切面类 ..._logge日志怎么写入数据库

树莓派使用硬件加速视频转码_树莓派4b硬编码-程序员宅基地

文章浏览阅读5.9k次,点赞2次,收藏12次。树莓派使用硬件加速视频转码现在随着智能设备普及以及宽带的升级,越来越的的视频素材在不断的产生。无论是我们自己拍摄的视频,还是从网上收集来的电影、电视剧,并不是全部都值得我们保存最高清的版本。打个比方,比如你下载了一个 1080P 甚至是 4K 的电影视频,看完了之后,觉得这个电影值得收藏,但又不至于非常喜欢。一个 1080P 2个小时左右的视频可能大概有 5G 左右,如果将其压缩到 720P,那..._树莓派4b硬编码

福利来啦!Python资料合集免费领!!!_python免费资料-程序员宅基地

文章浏览阅读1.1w次,点赞3次,收藏19次。资料合集免费领:https://t.csdnimg.cn/xxWg2020年转眼已过大半,在近一年的编程语言榜单中,Python已经走上卫冕的道路,并且与Java的差距拉得更远了一些。以往与Java常呈现你追我赶之势,而这一次则是直接相差由10%增加到15%!为什么只有Python这么火,能有机会成为通用语言?核心还是因为企业需要用它!因为其易用、逻辑简单并拥有海量扩展包等特性,不仅成为了 AI 的首选语言,而且在数据分析、Web、爬虫等领域也一样如此!不过,它最厉害的地方还是:._python免费资料

推荐文章

热门文章

相关标签