# 仿网易云音乐播放器

**Repository Path**: first_scw/Music

## Basic Information

- **Project Name**: 仿网易云音乐播放器
- **Description**: 使用vue做的音乐播放器
- **Primary Language**: JavaScript
- **License**: MulanPSL-1.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 4
- **Forks**: 1
- **Created**: 2020-10-09
- **Last Updated**: 2022-04-03

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

### 模仿网易云音乐播放器
模仿网易云的音乐播放器，实现了基本功能。还有一些功能，没有一一展示，后续还会增加一些功能。
主要的技术难点，就是实现音乐的播放，还有歌曲滚动。用到了$emit $on $parent等传值方式。
### 主要技术
> 1. Vue
> 2. ElementUi
> 3. VueCli
> 4.部分样式用到了less
> 5.axios
### 目前功能（后续还会添加）
* 首页
* 歌单
* 排行榜
* 最新音乐
* 视频和mv
* 登录
* 歌单详情
* 歌曲详情
* 视频和mv详情
* 歌曲、mv、歌单、视频评论
* 收藏歌单
* 相似mv
* 搜索详情
* 自动播放
## 项目效果展示
视频预览地址：https://www.bilibili.com/video/bv1dy4y1r7jg
### 首页
![](https://github.com/scw-git/music/blob/master/img/%E9%A6%96%E9%A1%B5.png)
### 歌单
![](https://github.com/scw-git/music/blob/master/img/%E6%AD%8C%E5%8D%95.png)
### 排行榜
![](https://github.com/scw-git/music/blob/master/img/%E6%8E%92%E8%A1%8C%E6%A6%9C.png)
### 最新音乐
![](https://github.com/scw-git/music/blob/master/img/%E6%9C%80%E6%96%B0%E9%9F%B3%E4%B9%90.png)
### 视频和mv
![](https://github.com/scw-git/music/blob/master/img/%E8%A7%86%E9%A2%911.png)
![](https://github.com/scw-git/music/blob/master/img/%E8%A7%86%E9%A2%912.png)
![](https://github.com/scw-git/music/blob/master/img/%E8%A7%86%E9%A2%91%E5%92%8Cmv%E8%AF%A6%E6%83%85.png)
### 登录
![](https://github.com/scw-git/music/blob/master/img/%E7%99%BB%E5%BD%95.png)
![](https://github.com/scw-git/music/blob/master/img/%E7%99%BB%E5%BD%95%E5%90%8E.png)
### 歌单详情
![](https://github.com/scw-git/music/blob/master/img/%E6%AD%8C%E5%8D%95%E8%AF%A6%E6%83%85.png)
### 歌曲详情
![](https://github.com/scw-git/music/blob/master/img/%E6%AD%8C%E6%9B%B2%E8%AF%A6%E6%83%85.png)
### 视频和mv详情
![](https://github.com/scw-git/music/blob/master/img/%E8%A7%86%E9%A2%91%E5%92%8Cmv%E8%AF%A6%E6%83%85.png)

## 快速启动

`进入music根目录，安装所需依赖`

```
npm install # 安装项目所需的依赖
npm run serve #启动项目服务

```
`然后下载大佬的接口，根据上面的提示安装即可`
接口网址https://binaryify.github.io/NeteaseCloudMusicApi/


## 致谢

本项目基于或参考以下项目：

1. [后台接口项目](https://binaryify.github.io/NeteaseCloudMusicApi)