uni-app写小程序音乐播放器

[video(video-hWvcQgvA-1586244155491)(type-bilibili)(url-https://player.bilibili.com/player.html?aid=285135567)(image-https://img-blog.csdnimg.cn/img_convert/db12d73ae6d46fa7f2a1134b1f5d5abb.png)(title-音乐播放小程序)]

uni-app开发,学习成本低开发小程序还是比较好用的

uni-app框架,这个框架现阶段还是有不少问题的,项目中遇到的几点
1,v-show不能正常使用->绑定一个display:none的样式根据条件判断实现v-show功能
2,axios好像不支持或者使用方式和vue中使用不同,也有提供的请求api
3,因为小程序没有dom的原因在标签上绑定ref无效,不过对于自定义的组件还是好使的

vuex的代码和组件的代码以及用到的图片音频放在GitHub中地址
目前这个小程序的歌词部分没有做完,有兴趣的朋友可以下载代码自己做试试看歌词也放在github中

总体来说对于小程序的api和组件还不认识几个的我来说也能写一个小程序,或者说写起来就跟写html一样一些问题网上查也大部分能解决,这个框架目前发展感觉还不错在社区提出问题下面也会有人讨论官方也经常有回答,希望以后uni-app发展越来越好吧


实现音乐播放功能
原生微信有一个wx.createInnerAudioContext(),uni-app对应的叫uni.createInnerAudioContext()
都是一个道理,这个api可以将当前scr属性指定的音乐进行播放暂停等操作,不过要注意的是如果每点击一此播放,就创建一个createInnerAudioContext()并给他添加src属性,设置它自动播放,当实现暂停功能式,会发现停不下来,原来的音乐还在播放,而当前点击的音乐也会开始播放,那是因为,每次点击添加的createInnerAudioContext()实例都是一个新的实例,如果确保全局只有一createInnerAudioContext()实例,对音乐的src属性的改变就反映在这个实例上,就可以实现音乐的暂停和播放等功能了

来找我玩啊
在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值