当前位置: 开发笔记 > 前端 > 正文

微信小程序使用audio组件播放音乐功能示例【附源码下载】

作者：机智的孙志嵘 | 来源：互联网 | 2022-02-26 08:33

这篇文章主要介绍了微信小程序使用audio组件播放音乐功能,结合实例形式分析了微信小程序audio组件播放在线音乐相关操作技巧,并附带源码供读者下载参考,需要的朋友可以参考下

本文实例讲述了微信小程序使用audio组件播放音乐功能。分享给大家供大家参考，具体如下：

1、效果展示

2、关键代码

① index.wxml

代码如下:

② index.js

Page({
 data: {
   audioPoster: 'http://y.gtimg.cn/music/photo_new/T002R300x300M000003rsKF44GyaSk.jpg&＃63;max_age=2592000',
   audioName: '此时此刻',
   audioAuthor: '许巍',
   audioSrc: 'http://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb.mp3&＃63;guid=ffffffff82def4af4b12b3cd9337d5e7&uin=346897220&vkey=6292F51E1E384E06DCBDC9AB7C49FD713D632D313AC4858BACB8DDD29067D3C601481D36E62053BF8DFEAF74C0A5CCFADD6471160CAF3E6A&fromtag=46',
 }
})

3、源代码点击此处本站下载。

更多audio组件详细用法说明可参考官网：https://mp.weixin.qq.com/debug/wxadoc/dev/component/audio.html#audio

希望本文所述对大家微信小程序开发有所帮助。

推荐阅读

html
iOS超签签名服务器搭建及其优劣势

本文介绍了搭建iOS超签签名服务器的原因和优势，包括不掉签、用户可以直接安装不需要信任、体验好等。同时也提到了超签的劣势，即一个证书只能安装100个，成本较高。文章还详细介绍了超签的实现原理，包括用户请求服务器安装mobileconfig文件、服务器调用苹果接口添加udid等步骤。最后，还提到了生成mobileconfig文件和导出AppleWorldwideDeveloperRelationsCertificationAuthority证书的方法。 ... [详细]

蜡笔小新 2023-12-11 20:23:23
js
Java验证码——kaptcha的使用配置及样式

本文介绍了如何使用kaptcha库来实现Java验证码的配置和样式设置，包括pom.xml的依赖配置和web.xml中servlet的配置。 ... [详细]

蜡笔小新 2023-12-13 13:58:25
js
小程序自动授权和手动接入的方式及操作步骤

本文介绍了小程序支持的两种接入方式：自动授权和手动接入，并详细说明了它们的操作步骤。同时还介绍了如何在两种方式之间切换，以及手动接入后如何下载代码包和提交审核。 ... [详细]

蜡笔小新 2023-12-11 18:21:09
js
Alink回归预测的不完善问题及期待

本文讨论了Alink回归预测的不完善问题，指出目前主要针对Python做案例，对其他语言支持不足。同时介绍了pom.xml文件的基本结构和使用方法，以及Maven的相关知识。最后，对Alink回归预测的未来发展提出了期待。 ... [详细]

蜡笔小新 2023-12-14 14:25:33
js
九度OnlineJudge之1002：Grading问题的解决方法

本文介绍了九度OnlineJudge中的1002题目“Grading”的解决方法。该题目要求设计一个公平的评分过程，将每个考题分配给3个独立的专家，如果他们的评分不一致，则需要请一位裁判做出最终决定。文章详细描述了评分规则，并给出了解决该问题的程序。 ... [详细]

蜡笔小新 2023-12-14 13:00:09
js
Open judge C16H: Magical Balls 快速幂+逆元问题解析

本文主要解析了Open judge C16H问题中涉及到的Magical Balls的快速幂和逆元算法，并给出了问题的解析和解决方法。详细介绍了问题的背景和规则，并给出了相应的算法解析和实现步骤。通过本文的解析，读者可以更好地理解和解决Open judge C16H问题中的Magical Balls部分。 ... [详细]

蜡笔小新 2023-12-14 12:03:27
js
P1651 塔 (动态规划) 的最大高度计算方法

本文介绍了P1651题目的描述和要求，以及计算能搭建的塔的最大高度的方法。通过动态规划和状压技术，将问题转化为求解差值的问题，并定义了相应的状态。最终得出了计算最大高度的解法。 ... [详细]

蜡笔小新 2023-12-13 19:52:19
js
flowable工作流流程变量_信也科技工作流平台的技术实践

1背景随着公司业务发展及内部业务流程诉求的增长,目前信息化系统不能够很好满足期望,主要体现如下：目前OA流程引擎无法满足企业特定业务流程需求，且移动端体 ... [详细]

蜡笔小新 2023-12-13 10:17:15
js
手把手教你使用GraphPad Prism和Excel绘制回归分析结果的森林图

本文介绍了使用GraphPad Prism和Excel绘制回归分析结果的森林图的方法。通过展示森林图，可以更加直观地将回归分析结果可视化。GraphPad Prism是一款专门为医学专业人士设计的绘图软件，同时也兼顾统计分析的功能，操作便捷，可以帮助科研人员轻松绘制出高质量的专业图形。文章以一篇发表在JACC杂志上的研究为例，利用其中的多因素回归分析结果来绘制森林图。通过本文的指导，读者可以学会如何使用GraphPad Prism和Excel绘制回归分析结果的森林图。 ... [详细]

蜡笔小新 2023-12-10 18:32:57
js
互联网思维中的3个段子，9大分类和19条法则

本文介绍了互联网思维中的三个段子，涵盖了餐饮行业、淘品牌和创业企业的案例。通过这些案例，探讨了互联网思维的九大分类和十九条法则。其中包括雕爷牛腩餐厅的成功经验，三只松鼠淘品牌的包装策略以及一家创业企业的销售额增长情况。这些案例展示了互联网思维在不同领域的应用和成功之道。 ... [详细]

蜡笔小新 2023-12-10 14:58:10
v8
Windows7企业版怎样存储安全新功能详解

本文介绍了电脑公司发布的GHOST WIN7 SP1 X64 通用特别版 V2019.12，软件大小为5.71 GB，支持简体中文，属于国产软件，免费使用。文章还提到了用户评分和软件分类为Win7系统，运行环境为Windows。同时，文章还介绍了平台检测结果，无插件，通过了360、腾讯、金山和瑞星的检测。此外，文章还提到了本地下载文件大小为5.71 GB，需要先下载高速下载器才能进行高速下载。最后，文章详细解释了Windows7企业版的存储安全新功能。 ... [详细]

蜡笔小新 2023-12-10 14:45:37
view
微信小程序导航跟随的实现方法

本文介绍了在微信小程序中实现导航跟随的方法。通过设置导航的position属性和绑定滚动事件，可以实现页面向下滚动到导航位置时，导航固定在页面最上方；页面向上滚动到导航位置时，导航恢复到原始位置；点击导航可以平滑跳转到相应位置。代码示例也给出了具体实现方法。 ... [详细]

蜡笔小新 2023-12-09 19:38:28
view
如何实现微信支付宝小程序二码合一的点餐功能？

本文讨论了如何在微信支付宝两套小程序中生成一张二维码，实现支付宝扫码进入支付宝小程序和微信扫码进入微信小程序的对应桌号进行点餐的功能，提供了一些实现方案供参考。 ... [详细]

蜡笔小新 2023-12-13 12:47:25
npm
网络请求模块选择——axios框架的基本使用和封装

本文介绍了选择网络请求模块axios的原因，以及axios框架的基本使用和封装方法。包括发送并发请求的演示，全局配置的设置，创建axios实例的方法，拦截器的使用，以及如何封装和请求响应劫持等内容。 ... [详细]

蜡笔小新 2023-12-12 10:16:43
npm
在Mac上安装Xamarin，实现在Windows上开发iOS app的方法

本文介绍了在Mac上安装Xamarin并使用Windows上的VS开发iOS app的方法，包括所需的安装环境和软件，以及使用Xamarin.iOS进行开发的步骤。通过这种方法，即使没有Mac或者安装苹果系统，程序员们也能轻松开发iOS app。 ... [详细]

蜡笔小新 2023-12-11 19:13:35

机智的孙志嵘

这个家伙很懒，什么也没留下！

Tags | 热门标签

RankList | 热门文章