/vue-music

从零开始 ! 试图做网易云音乐播放器了!

Primary LanguageVue

 

10 月 23 日更新

发现在ios 移动端体验有问题 修改了部分效果,至于音乐播放详情页(CD转动 播放页)的体验问题 (拖动卡顿,歌词效果不好等等) 我在我vue-website  有解决方法 附上对应的代码地址 和 体验效果

拖动的体验效果: http://www.daiwei.org/components/wx-audio/html/audio.html
歌词滚动的体验效果: http://www.daiwei.org/#/music/sheet/124995419  
对于的歌词解析以及滚动效果代码 见 :
https://github.com/IFmiss/vue-website/blob/master/src/components/music/music.js#L157  
如有问题  尽管联系我!

由于本地数据的音乐地址有变化,现在已经可以正常使用了   更新一下就行了   改了data.json的音乐url!

学习vue ,从0开始!

原本是学习vue而创建的,之后想在学习过程中加以实践。由于之前有做过jquery的播放器效果,ui仿照网易云,地址 www.daiwei.org/music ,于是就想做vue 的网易云播放器,网上也有类似的项目。看了一下都挺不错的,于是就想自己做一个试试

PC浏览地址 : http://www.daiwei.org/vue-music.html

手机扫描查看效果,云虚拟主机速度可能会比较慢,望理解.

项目基于Vue,涉及axios vue-router vuex

本人也是一枚小白,自学Vue,这个播放器有什么不足之处,希望各位可以提出意见建议,我们共同学习进步.学的不错的话  可以Star一下哦!!!

最近在更新个人网站,vue重新打造的个人网站2.0  搭配主页,状态,音乐,关于,每日笑话,天气,设置等,注重数据交互以及用户体验  地址: https://github.com/IFmiss/vue-website    在线预览地址: http://www.daiwei.org/new.html

项目下载到本地之后

  npm install
  npm run dev

即可查看效果

效果图

首页侧边栏以及部分组件

视频播放以及浮层音乐列组件

音乐详情页 播放暂停效果

音乐详情页切歌

歌单详情页(背景效果 滚动效果)

歌单专辑图片下载页

音乐详情歌词切换

发现音乐swiper效果