草庐IT

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

全栈弄潮儿 2023-04-14 原文

文章目录




微信小程序提供了丰富的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. ruby - 如何使用 Nokogiri 的 xpath 和 at_xpath 方法 - 2

    我正在学习如何使用Nokogiri,根据这段代码我遇到了一些问题:require'rubygems'require'mechanize'post_agent=WWW::Mechanize.newpost_page=post_agent.get('http://www.vbulletin.org/forum/showthread.php?t=230708')puts"\nabsolutepathwithtbodygivesnil"putspost_page.parser.xpath('/html/body/div/div/div/div/div/table/tbody/tr/td/div

  2. ruby - 使用 RubyZip 生成 ZIP 文件时设置压缩级别 - 2

    我有一个Ruby程序,它使用rubyzip压缩XML文件的目录树。gem。我的问题是文件开始变得很重,我想提高压缩级别,因为压缩时间不是问题。我在rubyzipdocumentation中找不到一种为创建的ZIP文件指定压缩级别的方法。有人知道如何更改此设置吗?是否有另一个允许指定压缩级别的Ruby库? 最佳答案 这是我通过查看ruby​​zip内部创建的代码。level=Zlib::BEST_COMPRESSIONZip::ZipOutputStream.open(zip_file)do|zip|Dir.glob("**/*")d

  3. ruby - 为什么我可以在 Ruby 中使用 Object#send 访问私有(private)/ protected 方法? - 2

    类classAprivatedeffooputs:fooendpublicdefbarputs:barendprivatedefzimputs:zimendprotecteddefdibputs:dibendendA的实例a=A.new测试a.foorescueputs:faila.barrescueputs:faila.zimrescueputs:faila.dibrescueputs:faila.gazrescueputs:fail测试输出failbarfailfailfail.发送测试[:foo,:bar,:zim,:dib,:gaz].each{|m|a.send(m)resc

  4. ruby-on-rails - 使用 Ruby on Rails 进行自动化测试 - 最佳实践 - 2

    很好奇,就使用ruby​​onrails自动化单元测试而言,你们正在做什么?您是否创建了一个脚本来在cron中运行rake作业并将结果邮寄给您?git中的预提交Hook?只是手动调用?我完全理解测试,但想知道在错误发生之前捕获错误的最佳实践是什么。让我们理所当然地认为测试本身是完美无缺的,并且可以正常工作。下一步是什么以确保他们在正确的时间将可能有害的结果传达给您? 最佳答案 不确定您到底想听什么,但是有几个级别的自动代码库控制:在处理某项功能时,您可以使用类似autotest的内容获得关于哪些有效,哪些无效的即时反馈。要确保您的提

  5. ruby - 在 Ruby 中使用匿名模块 - 2

    假设我做了一个模块如下:m=Module.newdoclassCendend三个问题:除了对m的引用之外,还有什么方法可以访问C和m中的其他内容?我可以在创建匿名模块后为其命名吗(就像我输入“module...”一样)?如何在使用完匿名模块后将其删除,使其定义的常量不再存在? 最佳答案 三个答案:是的,使用ObjectSpace.此代码使c引用你的类(class)C不引用m:c=nilObjectSpace.each_object{|obj|c=objif(Class===objandobj.name=~/::C$/)}当然这取决于

  6. ruby - 使用 ruby​​ 和 savon 的 SOAP 服务 - 2

    我正在尝试使用ruby​​和Savon来使用网络服务。测试服务为http://www.webservicex.net/WS/WSDetails.aspx?WSID=9&CATID=2require'rubygems'require'savon'client=Savon::Client.new"http://www.webservicex.net/stockquote.asmx?WSDL"client.get_quotedo|soap|soap.body={:symbol=>"AAPL"}end返回SOAP异常。检查soap信封,在我看来soap请求没有正确的命名空间。任何人都可以建议我

  7. ruby - 在 Ruby 程序执行时阻止 Windows 7 PC 进入休眠状态 - 2

    我需要在客户计算机上运行Ruby应用程序。通常需要几天才能完成(复制大备份文件)。问题是如果启用sleep,它会中断应用程序。否则,计算机将持续运行数周,直到我下次访问为止。有什么方法可以防止执行期间休眠并让Windows在执行后休眠吗?欢迎任何疯狂的想法;-) 最佳答案 Here建议使用SetThreadExecutionStateWinAPI函数,使应用程序能够通知系统它正在使用中,从而防止系统在应用程序运行时进入休眠状态或关闭显示。像这样的东西:require'Win32API'ES_AWAYMODE_REQUIRED=0x0

  8. python - 如何使用 Ruby 或 Python 创建一系列高音调和低音调的蜂鸣声? - 2

    关闭。这个问题是opinion-based.它目前不接受答案。想要改进这个问题?更新问题,以便editingthispost可以用事实和引用来回答它.关闭4年前。Improvethisquestion我想在固定时间创建一系列低音和高音调的哔哔声。例如:在150毫秒时发出高音调的蜂鸣声在151毫秒时发出低音调的蜂鸣声200毫秒时发出低音调的蜂鸣声250毫秒的高音调蜂鸣声有没有办法在Ruby或Python中做到这一点?我真的不在乎输出编码是什么(.wav、.mp3、.ogg等等),但我确实想创建一个输出文件。

  9. ruby-on-rails - 'compass watch' 是如何工作的/它是如何与 rails 一起使用的 - 2

    我在我的项目目录中完成了compasscreate.和compassinitrails。几个问题:我已将我的.sass文件放在public/stylesheets中。这是放置它们的正确位置吗?当我运行compasswatch时,它不会自动编译这些.sass文件。我必须手动指定文件:compasswatchpublic/stylesheets/myfile.sass等。如何让它自动运行?文件ie.css、print.css和screen.css已放在stylesheets/compiled。如何在编译后不让它们重新出现的情况下删除它们?我自己编译的.sass文件编译成compiled/t

  10. ruby - 使用 ruby​​ 将 HTML 转换为纯文本并维护结构/格式 - 2

    我想将html转换为纯文本。不过,我不想只删除标签,我想智能地保留尽可能多的格式。为插入换行符标签,检测段落并格式化它们等。输入非常简单,通常是格式良好的html(不是整个文档,只是一堆内容,通常没有anchor或图像)。我可以将几个正则表达式放在一起,让我达到80%,但我认为可能有一些现有的解决方案更智能。 最佳答案 首先,不要尝试为此使用正则表达式。很有可能你会想出一个脆弱/脆弱的解决方案,它会随着HTML的变化而崩溃,或者很难管理和维护。您可以使用Nokogiri快速解析HTML并提取文本:require'nokogiri'h

随机推荐