# CloudMusicApp

**Repository Path**: ygz1994/CloudMusicApp

## Basic Information

- **Project Name**: CloudMusicApp
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2020-06-28
- **Last Updated**: 2020-12-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

## 安装与运行

git clone https://github.com/jsonshao/CloudMusicApp

cd CloudMusicApp

npm install

npm run dev //服务端运行 访问 http://localhost:8080
## 技术栈
vue+vuex+router+axios+jsonp+es6+stylus+webapck 目前还没用到vue的前端ui组件库，打算看下vux听说这个ui组件库挺好
## demo实现功能

- [x]   通过jsonp真实获取qq音乐的数据
- [x]   实现个性化推荐页面，包括轮播图和歌单列表
- [x]   实现歌单列表的滚动
- [x]   实现歌单列表详情页面
- [x]   实现歌单列表详情页面歌曲播放
- [x]   实现歌手列表的展示
- [x]   实现歌手列表的滚动
- [x]   实现歌手列表和歌手分类的信息联动
- [x]   实现歌手详细信息的展示
- [x]   实现歌手详细页面歌曲播放
- [x]   实现歌单，歌手图片信息的懒加载问题
- [x]   实现数据请求延迟的lodding效果
..........
## 运行截图
![image](https://github.com/jsonshao/MusicWebApp/raw/master/static/test1.png)
![image](https://github.com/jsonshao/MusicWebApp/raw/master/static/test3.png)
![image](https://github.com/jsonshao/MusicWebApp/raw/master/static/test5.png)
![image](https://github.com/jsonshao/MusicWebApp/raw/master/static/test6.png)
![image](https://github.com/jsonshao/MusicWebApp/raw/master/static/test7.png)
![image](https://github.com/jsonshao/MusicWebApp/raw/master/static/test8.png)
![image](https://github.com/jsonshao/MusicWebApp/raw/master/static/test9.png)
![image](https://github.com/jsonshao/MusicWebApp/raw/master/static/test10.png)
![image](https://github.com/jsonshao/MusicWebApp/raw/master/static/test12.png)