Vue快速写一个简约炫酷的音乐播放器并打包发布到线上

已于 2023-05-23 18:26:35 修改
阅读量231 收藏 1
点赞数
分类专栏： Vue 文章标签： vue 前端 uni-app
于 2023-03-21 01:29:16 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/z010202/article/details/129678785
版权

听歌功能：

MV功能:

PC端音乐播放器，做了全屏，半屏和手机屏适配，有偏差

代码有点多不方便上传，感兴趣的伙伴可以到github拉

地址：SnowCyans/CloudMusic (github.com)

打包上线：

在HbuilderX编译器上配置然后打包

 

打包好后在在资源管理器打开unpackage文件夹下的h5文件夹

然后将h5文件夹里的文件全部推送到仓库 推送到github上主分支名称必须为gh-pages

推送完后打开该仓库的设置页面里的pages页等会一两分钟就会发布网站链接

访问地址 ：QQ云音乐 

白小纯纯纯
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
使用vue写了一个音乐播放器
肖肖肖丽珠的博客
11-02 501
let time = parseInt(min) * 60 * 1000 + parseInt(sec) * 1000 + parseInt(mill) //把分钟变成秒，秒变成毫秒。time = parseInt(min) * 60 * 1000 + parseInt(sec) * 1000 + parseInt(mill) //把分钟变成秒，秒变成毫秒。arr = text.split(/[(\f\n)\r\t\v]/).map((item, i) => { //用正则的换行符分割。
audio示例-基于Vue的一个小项目（上传音乐链接）
Yanfengting的博客
12-05 2005
1 标签定义声音，比如音乐或其他音频流。 2 设置为自动播放的 audio 元素：autoplay=“autoplay” 但是只有pc端可以实现 移动端不行(pc端的浏览器要比移动端的完善很多，对有些属性支持也会好很多) 3 audio不单单是个标签 他也是window下的一个对象，对象就有属性和方法，作为对象他有哪些常用的方法呢 对象属性： currentTime 获取当前播放时间 durat...
Vue，Axios，Vuex书写一个最简单的音乐播放器，从而实现音乐的播放功能
m0_56986233的博客
03-12 1603
1.定义一个组件，负责播放音乐 这里我们定义一个foot.vue的组件，做音乐播放器 <div class="footer"> <audio ref="player" :src="this.$store.state.MusicUrl" controls autoplay="autoplay"> </audio> </div> <style lang='less' scoped> .footer { width: 10
基于hbuilder开发的微信小程序音乐播放系统，可添加本地音乐（含源码）
10-19
可用hbuilder开发工具直接打开微信小程序，可直接运行，不需要调试，可直接使用。播放设置、下一首、上一首、暂停按键、播放列表等功能
vue vantUI实现文件（图片、文档、视频、音频）上传（多文件）
10-16
主要介绍了vue vantUI实现文件（图片、文档、视频、音频）上传（多文件），文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2021最新Vue3打造一款音乐播放器 (源码).zip
10-20
总结来说，这个Vue3音乐播放器项目涵盖了现代前端开发的多个方面，包括Vue3的新特性、前端音频处理、路由管理、样式设计以及项目构建工具的使用，对于想要深入学习Vue3和前端开发的开发者来说，是一个很好的实践案例...
一个月写完vue音乐播放器
01-08
还有就是在这个过程中，自己体验到一个比较完整的开发历程。为什么说是比较完整的项目开发历程，因为自己没有经历切图画界面着一块，自己甚至没有怎么去写UI界面。我的想法是趁着写着文档的同时，把写UI这一块也过一...
vue一个页面实现音乐播放器的示例
08-28
进度条是音乐播放器的另一个重要部分。作者使用了 range 输入框来设计进度条，使用 CSS 来美化进度条的样式。下面是进度条的设计代码： ``` input[type=range] { -webkit-appearance: none; width: 80%; height:...
vue-cli 打包后提交到线上出现 "Uncaught SyntaxError:Unexpected token" 报错
10-17
主要介绍了vue-cli 打包后提交到线上出现 "Uncaught SyntaxError:Unexpected token" 报错，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
基于Hbuilder的视频播放AppVideoPlay.rar
04-11
基于Hbuilder的视频播放AppVideoPlay，可放大，缩小视频窗口，可快进播放
仿酷狗音乐播放器
06-16
很多小伙伴都使用过酷狗音乐，如果你有属于一个自己开发的音乐播放器呢？这是一款在界面风格类似酷狗的app，你可以亲自动手将安装到你的手机上。对了，里面还有服务器端的代码，想要使用还要有一定的java知识去搭建服务呢？说这是一个真实投入使用的项目一点也不为过！
Javascript 入门级 编写简单的音乐播放器
CodingmanNAN的博客
10-08 1060
这是一篇关于播放器简单制作的博客。使用于入门级的朋友。功能主要实现了列表点击播放、播放及暂停、上下曲的切换及进图条和时间显示。
实现简易网易云音乐播放器
qq_52440306的博客
04-08 2049
实现简易网易云音乐播放器 文章目录实现简易网易云音乐播放器前言该功能实现了单机版，可以在浏览器上运行，满足了音乐播放器应有核心功能一、需要材料二、html部分三、css部分四、js代码 前言 该功能实现了单机版，可以在浏览器上运行，满足了音乐播放器应有核心功能 一、需要材料 HBuilder编辑器 jQuery库 图标素材，音乐素材 二、html部分 <!DOCTYPE html> <html> <head> <meta charset="utf
页面播放器制作
编程开发资料库
05-30 162
做了一个页面的视频播放器，功能简单，只是有些属性有记录意义。班门弄斧，请莫见笑！ 功能：程序会检索指定目录下的文件，并形成文件列表显示在页面上，单击列表中的文件可以播放该文件。播放器可以以全屏方式显示，通过javascript脚本，获取播放文件的总时间和当前播放时间。时间匆忙，功能有限，有时间会将发掘的新功能加入其中，望大家批评斧正！ 前台代码如下： &lt;%@ Page Languag...
千峰商城-springboot项目搭建-32-vue案例练习-音乐播放器
LYly_B的博客
07-10 317
找到music-1.0.0.jar所在的文件夹，在地址栏直接输入cmd，回车。 在cmd中输入： "java -jarmusic-1.0.0.jar"，回车，启动项目。 在浏览器地址栏输入："http://localhost:9999/music/search?s=张杰"，测试是否启动成功。 在HBuilder中编写音乐播放器显示效果。 音乐搜索： <!DOCTYPE html...
Qt之音乐播放器一
bladeandmaster88的博客
02-08 3125
1、实现播放歌曲 void Widget::on_playMusicButton_clicked()//点击播放歌曲按钮 { if(currentSongIndex > songIdList.size()) return; currentSongInfo = this->getSongRealLinkById(songIdList.at(currentSongIn
Vue 录音实时上传，分析问题，解决问题，最后展示完整方案
我是香菜
11-12 4209
因为公司事做语音翻译的，在官网上有个试用的功能，需要在网页上录音，并传到后台进行翻译并进行语音合成。 业务需求就是在网页上使用录音功能，每100ms 通信一次，将数据传输到后端进行一套链路处理， 原来的业务逻辑是使用http 进行通信，每1s 通信一次，但是想优化下准备使用websocket 通信，降低翻译延迟，将延时降低为100ms，所以进行优化。 1、项目问题 项目使用的前端框架是Vue，但是因为我是后端开发，所以我对vue不懂，前端的开发使用的插件是recorderX 。在每秒发送数据的时候还
ssm毕设项目动态个人网站8j9pz（java+VUE+Mybatis+Maven+Mysql+sprnig）
计算机程序设计
08-30 3798
Jdk1.8 + Tomcat8.5 + Mysql + HBuilderX（Webstorm也行）+ Eclispe（IntelliJ IDEA,Eclispe,MyEclispe,Sts都支持）。ssm毕设项目动态个人网站8j9pz（java+VUE+Mybatis+Maven+Mysql+sprnig）ssm + mybatis + Maven + Vue 等等组成，B/S模式 + Maven管理等等。2. 使用IDEA/Eclipse/MyEclipse导入项目，修改配置，运行项目；...
vue写一个音乐播放器
最新发布
04-05
2. 创建一个Vue组件来处理音乐播放器的UI和逻辑。可以使用Vue的单文件组件(SFC)或普通的Vue组件。 3. 在组件中引入音乐播放器插件并初始化播放器。 4. 绑定播放器的相关事件和方法，如播放、暂停、上一曲、下一曲、...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值