使用vue2.0实现的音乐播放器,有教程,附源码!!!

gaoxiaosong1113
gaoxiaosong1113 发布于 2017-01-10 17:32:51 浏览:4613 类型:原创 - 随笔 分类:Node.js - js插件 二维码: 作者原创 版权保护
最近在学vue,在掘金上看到一篇好帖子,实现的音乐播放器,心血来潮,自己也写了个~~~

实现的页功能:
  1. 排行榜
  2. 轮播图展示
  3. 搜索推荐
  4. 搜索结果
  5. 专辑
  6. 歌手
  7. 上一曲,下一曲,播放暂停
  8. 随机播放,循环播放,单曲播放
  9. 加入/删除播放列表,
  10. 查看专辑
  11. 查看歌手

github:戳这里预览地址:戳这里 喜欢的加个star
顺便加个收藏,点个赞~~
有兴趣的加个前端交流群:478688652,群里有vue2.0的教程

扫一扫手机预览
使用vue2.0实现的音乐播放器,有教程,附源码!!!


不说废话了,先上UI.
使用vue2.0实现的音乐播放器,有教程,附源码!!!使用vue2.0实现的音乐播放器,有教程,附源码!!!使用vue2.0实现的音乐播放器,有教程,附源码!!!使用vue2.0实现的音乐播放器,有教程,附源码!!!使用vue2.0实现的音乐播放器,有教程,附源码!!!使用vue2.0实现的音乐播放器,有教程,附源码!!!使用vue2.0实现的音乐播放器,有教程,附源码!!!使用vue2.0实现的音乐播放器,有教程,附源码!!!
z
给个赞 66 人点赞
收藏 84 人收藏
评论 已有 44 条评论;以下用户言论只代表其个人观点,不代表 前端网(QDFuns) 的观点或立场。
登录 以后才能发表评论
最热评论
zzmisss
zzmisss2017-01-11 15:14:3919F
厉害,也要做个像大神一样的动手能力者
举报 支持 (3) 回复 (1)
老姚
老姚2017-01-11 00:54:377F
牛逼!
举报 支持 (2) 回复 (0)
gaoxiaosong1113
gaoxiaosong11132017-01-11 15:17:1520F
加油吧,要学的东西还很多~~~~ 刚刚领导开会,让研究微信小程序~~~ //@zzmisss:厉害,也要做个像大神一样的动手能力者
举报 支持 (1) 回复 (2)
ls1210485244
ls12104852442017-01-10 21:36:196F
emoticon学习一下
举报 支持 (1) 回复 (0)
ywhluck
ywhluck2017-01-10 20:56:575F
coolemoticon
举报 支持 (1) 回复 (0)
最新评论
gaoxiaosong1113
gaoxiaosong11132017-01-28 15:20:2244F
请求的qq音乐的api接口 //@小单纯:你的数据怎么获取到的呢?  在那个文件夹中呢?
举报 支持 (0) 回复 (0)
gaoxiaosong1113
gaoxiaosong11132017-01-28 15:20:0443F
vue + vue-router - vuex //@598220654:这个应该怎么处理,过年就要模仿你这个项目了emoticon //@gaoxiaosong1113:应该是css兼容问题,我这边手机上都没有这个问题~~~~  这个断断续续的写了好长时间,因为公司也比较忙,只有空的时候才有时间写 //@598220654:为什么在歌词上我是叠在一起的?? 你这个案例写了几天啊!
举报 支持 (0) 回复 (0)
gaoxiaosong1113
gaoxiaosong11132017-01-28 15:19:3842F
psd随便找的,数据是qq音乐的 //@differ_wy:这个有psd的图么,想仿写一下,数据是取的哪里的呢?
举报 支持 (0) 回复 (0)
differ_wy
differ_wy2017-01-22 16:58:2741F
这个有psd的图么,想仿写一下,数据是取的哪里的呢?
举报 支持 (0) 回复 (1)
598220654
5982206542017-01-19 21:13:1640F
这个应该怎么处理,过年就要模仿你这个项目了emoticon //@gaoxiaosong1113:应该是css兼容问题,我这边手机上都没有这个问题~~~~  这个断断续续的写了好长时间,因为公司也比较忙,只有空的时候才有时间写 //@598220654:为什么在歌词上我是叠在一起的?? 你这个案例写了几天啊!
举报 支持 (0) 回复 (1)
小单纯
小单纯2017-01-18 13:42:2539F
你的数据怎么获取到的呢?  在那个文件夹中呢?
举报 支持 (0) 回复 (1)
729278592
7292785922017-01-18 09:34:4338F
http://open.itcast.cn/front/3-517.html                  微信小程序入门够了 //@gaoxiaosong1113:加油吧,要学的东西还很多~~~~ 刚刚领导开会,让研究微信小程序~~~ //@zzmisss:厉害,也要做个像大神一样的动手能力者
举报 支持 (0) 回复 (0)
cheng52364
cheng523642017-01-16 09:35:1437F
感谢,最近我也在学 vue vuex vue-router系列2.0版的 网上案例大多是1.0的 这个很难得。给赞
举报 支持 (0) 回复 (0)
1379089794
13790897942017-01-12 15:33:4036F
好帅哦你的github
举报 支持 (0) 回复 (0)
gaoxiaosong1113
gaoxiaosong11132017-01-12 10:12:3935F
emoticon 调节声音的没试过,有办法的可以试试 //@jieshuai:发现少了个调节音量的按钮
举报 支持 (0) 回复 (0)
jieshuai
jieshuai2017-01-12 10:09:0134F
发现少了个调节音量的按钮
举报 支持 (0) 回复 (1)
gaoxiaosong1113
gaoxiaosong11132017-01-12 09:38:2933F
应该是css兼容问题,我这边手机上都没有这个问题~~~~  这个断断续续的写了好长时间,因为公司也比较忙,只有空的时候才有时间写 //@598220654:为什么在歌词上我是叠在一起的?? 你这个案例写了几天啊!
举报 支持 (0) 回复 (1)
598220654
5982206542017-01-11 21:56:2832F
为什么在歌词上我是叠在一起的?? 你这个案例写了几天啊!
举报 支持 (0) 回复 (1)
Lookforto
Lookforto2017-01-11 17:47:1531F
好的,staremoticon //@gaoxiaosong1113:随意吧,是最新的2.0,代码已经放在github上面了,顺便加个star什么的 //@Lookforto:找着你这个音乐播放器学学可以不,这是最新2.0吗? //@gaoxiaosong1113:最合适的就是找现成的项目想敲一遍再说,但是不要照着写,要有自己的想法,用自己的方式实现想要的功能,而后开始第二个项目,完全由自己构思,从搭建环境到完工,走一遍,也差不多了。 //@Lookforto:嗯,有vue学习资料吗。我也要开始学vue了 //@gaoxiaosong1113:qq音乐H5上面扒 //@Lookforto:搜索音乐接口怎么弄到的
举报 支持 (0) 回复 (0)
gaoxiaosong1113
gaoxiaosong11132017-01-11 17:45:0530F
随意吧,是最新的2.0,代码已经放在github上面了,顺便加个star什么的 //@Lookforto:找着你这个音乐播放器学学可以不,这是最新2.0吗? //@gaoxiaosong1113:最合适的就是找现成的项目想敲一遍再说,但是不要照着写,要有自己的想法,用自己的方式实现想要的功能,而后开始第二个项目,完全由自己构思,从搭建环境到完工,走一遍,也差不多了。 //@Lookforto:嗯,有vue学习资料吗。我也要开始学vue了 //@gaoxiaosong1113:qq音乐H5上面扒 //@Lookforto:搜索音乐接口怎么弄到的
举报 支持 (0) 回复 (1)

作者最新