微信小程序音乐播放器组件
wxml
<image bindtap="click" src="{{isPlay?'/images/':'/images/'}}"/>
JS
Page({
data:{
isPlay:false
},
onLoad(){
var self = this;
//监听音乐播放
wx.onBackgroundAudioPlay((result)=>{
self.setData({
isPlay:true
})
});
//监听音乐停止
wx.onBackgroundAudioPause((result)=>{
self.setData({
isPlay:false
})
});
},
//执行点击事件,如果播放就停止,如果停止就播放
click(){
if(this.data.isPlay){
wx.pauseBackgroundAudio();
this.setData({
isPlay:fasle
})
}else{
//开始音乐播放
wx.playBackgroundAudio({
dataUrl:"",
title:"",
coverImgUrl:""
});
this.setData({
isPlay:true
})
}
}
})
若本号内容有做得不到位的地方(比如:涉及版权或其他问题),请及时联系我们进行整改即可,会在第一时间进行处理。
请点赞!因为你们的赞同/鼓励是我写作的最大动力!
欢迎关注达叔小生的简书!
这是一个有质量,有态度的博客

微信小程序音乐播放器组件的更多相关文章
- 微信小程序音乐播放器
写在前面 1.入门几天小白的作品,希望为您有帮助,有好的意见或简易烦请赐教 2.微信小程序审核音乐类别已经下架,想要发布选题需慎重.附一个参考链接,感谢https://www.hishop.com.c ...
- 微信小程序音乐播放
最近在写一个艾美食艾音乐的微信小程序,其中有用到音乐播放的功能,基本播放切换功能已经实现,但是在反复切换歌曲.重新进入歌曲以及单曲循环.列表循环的测试过程中还是发生了bug,特此写一篇文章,捋一下思路 ...
- 微信小程序——音频播放器
先来个效果图韵下味: 需求: 音频的播放,暂停,中间按钮状态的变化,播放时实时更新播放进度: 前进15s,后退15s: 进度条拖动. 一开始想着这3个功能应该挺简单的.不就是播放,暂停,前进,后退么~ ...
- 微信小程序---音乐播放和控制
1.效果图如下: 2.代码如下: //index.js //获取应用实例 var app = getApp() Page({ data: { motto: 'Hello World', userInf ...
- 微信小程序自运营器 微信小程序自动运营器(让你的微信小程序,公众号零运营成本,24小时全自动运营)
自动发单,自动评价,自动评论,自动推广 微信小程序自运营器 微信小程序自动运营器(让你的微信小程序,公众号零运营成本,24小时全自动运营) 我们会根据你的微信公众号或微信小程序定制开发带有一定AI智 ...
- 微信小程序页面调用自定义组件内的事件
微信小程序页面调用自定义组件内的事件 page page.json { "usingComponents": { "my-component": ". ...
- 微信小程序api拦截器
微信小程序api拦截器 完美兼容原生小程序项目 完美兼用小程序api的原本调用方式,无痛迁移 小程序api全Promise化 和axios一样的请求方式 小程序api自定义拦截调用参数和返回结果 强大 ...
- 微信小程序(二十)-UI组件(Vant Weapp)-01按装配置
1.官网 https://vant-contrib.gitee.io/vant-weapp/#/intro https://gitee.com/vant-contrib/vant-weapp 2.按装 ...
- 微信小程序音频播放 InnerAudioContext 的用法
今天项目上涉及到了微信小程序播放音频功能,所以今天跟着一些教程做了个简单的播放器 1.实现思路 刚开始想着有没有现成的组件可以直接用,找到了微信的媒体组件 audio,奈何看着 1.6.0版本开始,该 ...
随机推荐
- java之aop
1.AOP:aspect orientied programming 面向切面编程.就是横向编程. 2.面向切面编程是在不改变原有代码的情况下增加新的功能. 3.在spring中面向切面编程有两种应用 ...
- C#字符串基础
C#字符串基础 1. 字符串的两种创建形式 (1)String A=”cat”; (2)String B=new string{‘a’,4} .调用类方法,创建一个“aaaa”的字符串 (3) ...
- WebServices 使用Session
using System;using System.Collections.Generic;using System.Data;using System.Linq;using System.Web;u ...
- Matlab适配器模式
适配器模式是连接两个不兼容接口的桥梁,主要分为三种:类适配器.对象适配器以及接口适配器,本文根据https://blog.csdn.net/u012359453/article/details/791 ...
- Python illustrating Downhill simplex method for minimizing the user-supplied scalar function的代码
学习过程,把代码过程较好的代码段做个记录,如下的代码段是关于Python illustrating Downhill simplex method for minimizing the user-su ...
- MySQL Percona Toolkit--pt-osc重点参数
修改命令参数alter .不需要包含alter table关键字,可以包含多个修改操作,使用逗号分开,如"drop clolumn c1, add column c2 int" . ...
- windows10 进入BIOS
windows10开机进入不了BIOS 原因 上网查了电脑固件所应该有的进入键,什么F1.F2.F12.Delete以及什么要配置Fn+F1...等等方法就是开机进入不了BIOS. 解决办法 最后发现 ...
- docker管理监控方案
docker相关管理可分为四类:docker基础功能.docker监控.docker集群管理和docker系统认证管理.docker管理的基础或信息来源都是docker命令行或docker API. ...
- Gradle 使用教程之 Task 详解
最近打算学习下 gradle 在 Android 中的使用,结果百度出来的文章都是介绍性文章,没啥干货.后来找到 gradle 官网教程,自己对着撸. Gradle 概述: Gradle 是一个基于 ...
- 关闭firefox火狐浏览器下载完成时自动扫描(49.0.2以后版本)
本人自己找到的方法,亲测有效,如下:1.在火狐浏览器地址里输入about:config回车,可能会提示“这可能使质量保证失效”,点击[我了解此风险!]2.在搜索框里输入browser.safebrow ...