Giter VIP home page Giter VIP logo

vue-music's Introduction

vue-music

项目介绍

本项目使用 vue、element-ui、axios 等技术,以网易云音乐PC客户端为模板实现了功能较为完善的网页播放器

实现情况

  • 搜索面板及搜索结果面板
  • 发现面板(只包含轮播图和推荐歌单)
  • 创建的歌单(只包含收藏的音乐)
  • 收藏的歌单
  • 播放器(包括底部播放器以及点击封面弹出的歌词页面)
  • 专辑页面(复用歌单页面)
  • 歌手页面(包括专辑列表(列表样式)和歌手详情)

账号、视频、直播等相关内容均未实现;

未考虑兼容性、移动端适配等问题;

不同页面中包含的子项的跳转(比如单曲列表中点击歌手跳转到歌手页面)比较繁琐,并且会增加需要持有的数据,意义不大,故没有做;

项目运行

本项目需要 NeteaseCloudMusicApi(版本:4.0.9) 在端口3000运行

$ npm install
$ npm run serve

效果展示

发现音乐页面

1.png

歌单页面

2.png

搜索面板及搜索结果页面

6.png

3.png

播放面板(歌词滚动)

4.png

歌手页面

5.png

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.