随着不断的学习 Vue，需要做一个小项目通过在实现项目过程中了解到更多的知识。随着如今人们对于音乐的需求，移动端的使用量愈发增加，项目通过 Vue 编写实现，全面借用网易云音乐移动端的 UI 设计、功能实现，努力做到以假乱真的效果。前几天便着手开始弄了,到今天为止也算是勉强能用了。
本项目自行构思得出，由个人独立编写程序研究。
注：此项目纯属个人瞎搞，正常使用请选择网易云音乐官方客户端。
全面实现移动端网易云音乐的功能
项目还在编写完善中
node 版本
[10.15.3]
# 克隆
git clone https://github.com/powerdong/Music-player.git
# 打开项目目录
cd Music-player
cd musicPlayer
# 安装依赖
npm install
# 开启本地服务运行项目
npm run dev
欢迎 star，欢迎 issue
上一次更新(2020-03-15)： 登录功能bug修复
最近一次更新(2020-05-04)： 歌单详情bug修复
感谢大家的关注，最近在实习期间未能及时更新，最近发现网易的api返回有变化，回来改了一个问题
- 版本信息： 2.4.8-> 2.8.10
- 时间： 2019 年 12 月 7 日
- 更新内容：
- 增加发现页面下拉刷新+轻提示
- 增加电台排行页面主播榜
- 增加电台排行页面节目榜中 24 小时榜
- 增加电台排行页面电台榜中付费精品榜
- 修复登录页面不能返回 Bug
- 修复其他已知问题
- 优化结构
使用中有任何问题或建议，欢迎 Issue！
本项目在不断完善中，请大家拭目以待~
- Vue 全家桶(使用 Vue-cli 作为构建工具)
- WebPack4.0
- ES6
- Less
- ESLint
- Vant UI
- 网易云音乐 API
demo 地址（请用 chrome/firefox 手机模式预览） -- 暂时停止
- 手机登录、注册
- 修改密码
- 我的页面歌单信息
- 添加，删除歌单
- 最近播放
- 心动模式
- 我的电台
- 我的收藏
- 发现页面推荐歌单
- 发现页面新碟
- 发现页面新歌
- 发现页面每日推荐
- 发现页面歌单
- 视频页面
- 朋友页面
- 歌单广场
- 新歌推荐
- 更多新碟
- 发现页面排行榜
- 发现页面电台
- 退出账号
- 发现页面私人 FM
- 搜索功能
- 搜索结果展示
- 热搜榜
- 历史记录
- 搜索推荐
- 歌手分类
- 播放功能(小播放器进度条)
- 播放列表
- 添加删除播放列表
- 签到
- 歌曲喜欢与否
- 专辑收藏与否
- 歌单评论
- 专辑评论
- 点赞、发送、删除评论
- 电台节目评论
- 视频评论
- 用户相关
- 页面滚动加载
- 左右滑动切换
- 页面切换动画
- 登陆情况判断
- 全面优化&修复
侧边账户中心
发现页面&每日推荐
歌单&歌单详情
排行榜&排行榜信息
我的页面&最近播放
我的歌单&播放歌曲
搜索展示
.src
+-- api
| +-- config.js // 存取相关的api地址
| +-- index.js // 请求相关的api方法
+-- assets
| +-- styles
| +-- border.css // 移动端的1px边框
| +-- global.less // 全局应用样式
| +-- reset.css // 重置样式
| +-- resetEleUI.less // 修改elementUI组件样式
| +-- utils // 全局要使用的方法
| +-- getPhone // 获取手机号码
| +-- modalScroll // 处理移动端滚动条
| +-- Bus.js // Bus 总线
| +-- Mixins.js // 混入(mixin)
+-- base // 存取页面公共的小组件
+-- albumPage // 歌单展示页面组件
+-- songListPage // 展示歌曲列表
+-- alert // 提示消息
+-- audioAllTitle // 播放全部标题行
+-- button // 登陆页面按钮
+-- djSublistCard // 类似于我的电台页面的长卡片组件
+-- generalNav // 通用页面顶部的标题行
+-- icon // 图标展示
+-- idxCard // 官方排行榜
+-- imgCard // 歌单的图片卡
+-- interchangeable // 用来展示搜索展示页面除单曲以外的项目
+-- loading // 转圈loading
+-- pageErrorInfo // 出错提醒
+-- pageErrorLoading // 页面加载loading
+-- searchInput // 搜索框
+-- slider // 播放列表滑块
+-- sliderNav // 滑动标题
+-- song // 歌曲项
+-- titleFooter // 搜索展示页综合页面各项通用头和尾
+-- getInfos // 获取一些静态信息
+-- getData // 获取静态信息方法
+-- icon // 存取图标信息
+-- pages // 项目路由页面
+-- router // 路由配置
+-- index
+-- store // vuex 配置使用
+-- action // 根级别的 action
+-- getter // 根级别的 getter
+-- index // 组装模块并导出 store 的地方
+-- mutation-types // 根级别的 mutation-types
+-- mutation // 根级别的 mutation
+-- state // 根级别的 state
本项目会长期更新，欢迎大家指出问题，共同学习
👤 Lambda