vue实现音乐平台项目

置顶 已于 2022-03-07 16:03:05 修改
阅读量1.3w 收藏 210
点赞数 70
分类专栏： vue 文章标签： vue
于 2020-09-18 13:20:25 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/kzj0916/article/details/108663177
版权

成果

在这里插入图片描述
具体效果看B站视频演示；
B站地址：视频演示
github地址：项目源码
码云地址：项目源码
vue3版本地址：添加链接描述
各位大佬，帮忙点个赞，投个币，star下,万分感谢大家！

项目结构

因为文件较多，我是通过截图然后注释上文字，图片有点多，想要了解的话可以私信我，或者b站也有联系方式。
代码重要部分都详细注释解释了

过程

说说搭建过程吧，从无到有，感觉刚开始就得要有构思，先不急着做，先观察结构上布局，规划好路由的设置，有哪几个部分需要跳转，哪里是公共的，哪里是一直显示的，都要好好想想。
刚开始的话还是要做出页面的大致布局。然后再一个一个组件开发。
对于组件

最低0.47元/天 解锁文章
一个Vue.js音乐项目
cuk5239的博客
07-24 346
vue音乐163 (vue-music163) A webapp what base Vue2.0 contains seaching and playing music. 一个基于Vue2.0的webapp包含搜索和播放音乐。 View demo 查看演示 Download Source 下载源 用 (Use) vuejs-2.0 vuejs-2.0 vue-cli...
基于SpringBoot+Vue的音乐网站项目-附源码+报告
热门推荐
m0_52435951的博客
12-28 1万+
本音乐网站的客户端和管理端使用 VUE 框架来实现，服务端使用 Spring Boot + MyBatis 来实现，数据库使用了 MySQL。 技术栈 后端 SpringBoot + MyBatis 前端 Vue + Vue-Router + Vuex + Axios + ElementUI git 开发环境 JDK： jdk-8u141 mysql：mysql-5.7.21-1-macos10.13-x86_64 node：v12.4.0 IDE
vuemusic:一个Vue.js创建的音乐项目
04-10
Vue-music Welcome to Vue-Music-Player:waving_hand: 项目相关技术栈：Vue.js + Vue Router + Vuex + axios + jsonp + better-scroll :rocket: 如何运行 # 克隆 git clone https://github.com/yxiuzhu/vuemusic # 打开项目目录 cd vuemusic # 安装依赖 npm install # 开启本地服务运行项目 npm run dev 项目演示 （请用chrome手机模式预览） 项目页面及功能 recommend推荐页面 singer歌手页面 singer-detail歌手详情页面 player音乐播放器组件 disc歌曲推荐歌单页面 rank排行榜及其详情页面 search搜索页面 playlist歌曲播放列表组件 usercenter用户中心页面 :thumbs_up:recommend
Vue.js音乐
大灰狼的小绵羊哥哥的博客
03-20 827
https://github.com/zce/music-player Music Player by Vue Stack Clone it $ git clone https://github.com/zce/music-player.git -b vue --depth 1 $ cd music-player Run it Install De
element-plus 的简单应用
最新发布
等什么君！的博客
03-26 1690
本篇博客，简单介绍了，怎么使用element-plus 来构建简单的查询界面下一步，就该从后端服务器获取数据，进一步完善。
Vue 实现的音乐项目 music app 知识点总结分享
weixin_34267123的博客
02-15 688
项目总结 这是我第二个用 Vue 实现的项目，下面内容包括了在实现过程中所记录的知识点以及一些小技巧 项目演示地址：https://music-vue.n-y.io源代码地址：https://github.com/nanyang24/... 其他 此应用的全部数据来自 QQ音乐，利用 axios 结合 node.js 代理后端请求抓取 全...
vue音乐app项目
aptx4869200312的博客
01-08 838
转载https://blog.youkuaiyun.com/qq_34235864/article/details/86151807 VUE移动端音乐APP 1.项目准备 【音乐App】—— Vue-music 项目学习笔记：项目准备 前言： 学习慕课网Vue高级实战课程后，在实践中总结一些这个项目带给自己的收获，希望可以再次巩固关于Vue开发的知识。这一篇主要梳理：项目概况、项目准备、页面骨架搭建。项目gi...
Vue音乐项目笔记（一）
weixin_30879833的博客
08-16 167
看到一位小可爱的手记，这里记录一下自己需要注意的地方的链接 1.手写轮播图(上) https://blog.youkuaiyun.com/weixin_40814356/article/details/80298115 遇到的问题：上面这样写完后。slide-item的class名字不能添加上，什么原因。 在这里的问题我反复看了一下，具体的意思如下。 这样，就解决了。 然后呢，...
仿网易云音乐平台（vue项目）
06-30
JavaScript是实现音乐播放器功能的关键，它处理用户交互、音频播放控制、歌曲切换等逻辑。例如，JavaScript 可能用于监听播放/暂停按钮的点击事件，控制audio标签进行播放或暂停；同时，也可能处理播放进度的实时...
基于springboot+mybatis后台vue实现的音乐网站项目毕业设计源码+数据库（高分项目）
11-27
基于springboot+mybatis后台vue实现的音乐网站项目毕业设计源码+数据库（高分项目），本项目是一套98分毕业设计系统，主要针对计算机相关专业的正在做毕设的学生和需要项目实战练习的学习者，也可作为课程设计、期末...
Vue开发-基于vue实现的音乐播放器项目.zip
05-09
在这个"Vue开发_基于vue实现的音乐播放器项目"中，我们将深入探讨如何利用Vue.js来构建一个功能完备的音乐播放器。 首先，让我们来看看Vue.js的核心特性。Vue.js的核心设计理念是通过声明式渲染来简化界面更新，这...
vue2.0音乐app项目源码
12-07
本项目“vue2.0音乐app”是基于Vue 2.0的实践案例，旨在帮助开发者学习如何利用Vue 2.0构建一个完整的音乐应用程序。 首先，我们需要了解Vue 2.0的核心概念。Vue 2.0的核心包括组件系统、虚拟DOM、响应式数据绑定和...
仿网易音乐VUE项目
08-06
仿网易音乐VUE项目 ## 功能特性 1. 登录 2. 刷新登录 3. 发送验证码 4. 校验验证码 5. 注册(修改密码) 6. 获取用户信息 , 歌单，收藏，mv, dj 数量 7. 获取用户歌单 8. 获取用户电台 9. 获取用户关注列表 10. 获取用户粉丝列表 11. 获取用户动态 12. 获取用户播放记录 13. 获取精品歌单 14. 获取歌单详情 15. 搜索 16. 搜索建议 17. 获取歌词 18. 歌曲评论 19. 收藏单曲到歌单 20. 专辑评论 21. 歌单评论 22. mv 评论 23. 电台节目评论 24. banner 25. 获取歌曲详情 26. 获取专辑内容 27. 获取歌手单曲 28. 获取歌手 mv 29. 获取歌手专辑 30. 获取歌手描述 31. 获取相似歌手 32. 获取相似歌单 33. 相似 mv 34. 获取相似音乐 35. 获取最近 5 个听了这首歌的用户 36. 获取每日推荐歌单 37. 获取每日推荐歌曲 38. 私人 FM 39. 签到 40. 喜欢音乐 41. 垃圾桶 42. 歌单 ( 网友精选碟 ) 43. 新碟上架 44. 热门歌手 45. 最新 mv 46. 推荐 mv 47. 推荐歌单 48. 推荐新音乐 49. 推荐电台 50. 推荐节目 51. 独家放送 52. mv 排行 53. 获取 mv 数据 54. 播放 mv/视频 55. 排行榜 56. 歌手榜 57. 云盘 58. 电台 - 推荐 59. 电台 - 分类 60. 电台 - 分类推荐 61. 电台 - 订阅 62. 电台 - 详情 63. 电台 - 节目 64. 给评论点赞 65. 获取动态 66. 热搜列表(简略) 67. 发送私信 68. 发送私信歌单 69. 新建歌单 70. 收藏/取消收藏歌单 71. 歌单分类 72. 收藏的歌手列表 73. 订阅的电台列表 74. 相关歌单推荐 75. 付费精选接口 76. 音乐是否可用检查接口 77. 登录状态 78. 获取视频播放地址 79. 发送/删除评论 80. 热门评论 81. 视频评论 82. 退出登录 83. 所有榜单 84. 所有榜单内容摘要 85. 收藏视频 86. 收藏 MV 87. 视频详情 88. 相关视频 89. 关注用户 90. 新歌速递 91. 喜欢音乐列表(无序) 92. 收藏的 MV 列表 93. 获取最新专辑 94. 听歌打卡 95. 获取视频标签/分类下的视频 96. 已收藏专辑列表 97. 获取动态评论 98. 歌单收藏者列表 99. 云盘歌曲删除 100. 热门话题 101. 电台 - 推荐类型 102. 电台 - 非热门类型 103. 电台 - 今日优选 104. 心动模式/智能播放 105. 转发动态 106. 删除动态 107. 分享歌曲、歌单、mv、电台、电台节目到动态 108. 通知-私信 109. 通知-评论 110. 通知-@我 111. 通知-通知 112. 设置 113. 云盘数据详情 114. 私信内容 115. 我的数字专辑 116. batch批量请求接口 117. 获取视频标签列表 118. 全部mv 119. 网易出品mv 120. 收藏/取消收藏专辑 121. 专辑动态信息 122. 热搜列表(详细) 123. 更换绑定手机 124. 检测手机号码是否已注册 125. 初始化昵称 126. 更新歌单描述 127. 更新歌单名 128. 更新歌单标签 129. 默认搜索关键词 130. 删除歌单 131. 电台banner 132. 用户电台 133. 热门电台 134. 电台 - 节目详情 135. 电台 - 节目榜 136. 电台 - 新晋电台榜/热门电台榜 137. 类别热门电台 138. 云村热评 139. 电台24小时节目榜 140. 电台24小时主播榜 141. 电台最热主播榜 142. 电台主播新人榜 143. 电台付费精品榜 144. 歌手热门50首歌曲 145. 购买数字专辑 146. 获取 mv 点赞转发评论数数据 147. 获取视频点赞转发评论数数据 148. 调整歌单顺序 149. 调整歌曲顺序 150. 独家放送列表 151. 获取推荐视频 152. 获取视频分类列表 153. 获取全部视频列表接口 154. 获取历史日推可用日期列表 155. 获取历史日推详细数据 156. 国家编码列表 157. 首页-发现 158. 首页-发现-圆形图标入口列表 159. 数字专辑-全部新碟 160. 数字专辑-热门新碟 161. 数字专辑&数字单曲-榜单 162. 数字专辑-语种风格馆 163. 数字专辑详情 ## 环境要求 需要 NodeJS 8.12+ 环境
基于springboot+vue的音乐网站开发项目
02-19
1、资源内容：一个音乐网站，期末实训大作业，内含实训完整报告 2、使用方法：需要先启动springboot服务器，再启动vue项目
Vue实现音乐网站
dkjhl的博客
02-14 717
vue2.0实现音乐APP，主要实现功能如下：推荐页面，页面骨架，歌手页面，歌手详情，酷炫播放器，音乐点播，音乐分享，更有视频学习资料，你值得拥有
audio示例-基于Vue的一个小项目（上传音乐链接）
Yanfengting的博客
12-05 2056
1 标签定义声音，比如音乐或其他音频流。 2 设置为自动播放的 audio 元素：autoplay=“autoplay” 但是只有pc端可以实现 移动端不行(pc端的浏览器要比移动端的完善很多，对有些属性支持也会好很多) 3 audio不单单是个标签 他也是window下的一个对象，对象就有属性和方法，作为对象他有哪些常用的方法呢 对象属性： currentTime 获取当前播放时间 durat...
vue-music（1）音乐播发器 项目开发记录
weixin_33766805的博客
08-25 1038
Vue-Music 跟学一个网课老师做的仿原生音乐APP跟学的笔记，记录点滴，也希望对学习vue初学小伙伴有点帮助 一| 前期工作 1.项目初始化 npm install -g vue-cli vue init webpack vue-music npm install stylus stylus-loader -D 修改eslint...
基于Vue实现音乐APP项目资料分享
我的博客
08-28 1349
综述：挺好的资料，分享下共同提高 1、从浏览器多进程到JS单线程，JS运行机制最全面的一次梳理：https://juejin.im/post/5a6547d0f265da3e283a1df71.26 2、Front-end-Web-Development-Interview-Question：https://github.com/paddingme/Front-end-Web-Develo...
Vue怎样新建并启动项目（图文教程详解）
BADAO_LIUMANG_QIZHI的博客
11-25 1233
新建项目 进入到想新建项目的目录，在此处打开命令行窗口，然后输入： vue init webpack vuemusicplayer 其中 webpack 是模板，vuemusicplayer是项目名，然后回车 此时会提示你输入项目名，如果直接回车则使用上面默认的项目名。 然后依次输入描述、作者，然后直接回车。 然后询问你是否安装Vue Router，输入y，安装，其他的不需要...
Vue仿云音乐实战项目功能实现
2. 仿云音乐项目：这个项目是基于Vue.js框架构建的，其目的是模仿云音乐（如网易云音乐、QQ音乐等）的某些功能。通过这种实战练习，开发者可以学习和掌握在实际音乐平台中常见的功能，例如播放列表、歌曲搜索、用户...
评论 17
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值