本人在自学vue,之后想在学习过程中加以实践。由于之前有做过jquery的播放器效果,ui仿照网易云,地址 www.daiwei.org/music

于是就想做vue 的网易云播放器,网上也有类似的项目。看了一下都挺不错的,于是就想自己做一个试试

对 JUST DO IT !!!   DO IT !!!

项目基于Vue 2.0  使用Vue-router,axios获取本地的data.json文件(所有的用户,音乐信息),以及vuex 的状态管理

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

GitHub地址: https://github.com/IFmiss/vue-WangYiCloudMusic 欢迎Star!!!

这个项目会一直更新,还有很多模块需要去完成,下一步就是歌词,歌单详情的内容了

首页 及侧边栏信息

底部播放 和 浮层音乐列表信息

播放详情页 播放暂停效果

播放详情切歌效果

基于vue2.0的网易云音乐 (实时更新)的更多相关文章

  1. kallinux2.0安装网易云音乐

    安装 dpkg -i netease-cloud-music_1.0.0_amd64.kali2.0(yagami).deb apt-get -f install dpkg -i netease-cl ...

  2. 瓣呀,一个基于豆瓣api仿网易云音乐的开源项目

    整体采用material design 风格,本人是网易云音乐的粉丝,所以界面模仿了网页云音乐,另外,项目中尽量使用了5.0之后的新控件. 项目整体采用mvp+rxjava+retrofit 框架,使 ...

  3. Manjaro / ArchLinux 安装网易云音乐解决搜索不能输入中文方法

    0. 安装网易云音乐 yay -S netease-cloud-music 1.先安装qcef这个软件包. sudo yay -S qcef 2.编辑/opt/netease/netease-clou ...

  4. 基于vue2+vuex+vue-router+sass+webpack的网易云音乐

    [本博客为原创:http://www.cnblogs.com/HeavenBin/]  前言: 这段时间写的一个项目,供给大家互相学习,有什么疑问可以issues我. 源码地址:https://git ...

  5. 基于Taro与Typescript开发的网易云音乐小程序

    基于Taro与网易云音乐api开发,技术栈主要是:typescript+taro+taro-ui+redux,目前主要是着重小程序端的展示,主要也是借此项目强化下上述几个技术栈的使用,通过这个项目也可 ...

  6. 基于Taro与typescript开发的网易云音乐小程序(持续更新)

    基于Taro与网易云音乐api开发,技术栈主要是:typescript+taro+taro-ui+redux,目前主要是着重小程序端的展示,主要也是借此项目强化下上述几个技术栈的使用,通过这个项目也可 ...

  7. 关于linux下安装并打开网易云音乐——v 1.0.0

    首先,在网易云音乐官网的下载页面下载linux版本网易云音乐安装包(.deb文件) 下载好之后,在下载文件夹中双击打开文件,等待安装完毕 安装完成之后,直接双击图标是打不开的 需要用管理员命令打开 c ...

  8. 用vuejs仿网易云音乐(实现听歌以及搜索功能)

    前言 前端时间学了vue,一开始看了vue1.0,后来实在觉得技术总得实践,就直接上手vue2.0.然后花了将近一周时间做了一个网易云音乐的小项目.一开始觉得项目比较小,没必要用vuex所以就没有使用 ...

  9. 用VUEJS做一个网易云音乐

    前言:自己学习VUEJS也一段时间,但一直没有做出来一东西.我自己一直喜欢用网易云音乐app,于是乎就做了这个app. 项目截图 技术栈 vue全家桶 (vue vue-router vuex) ax ...

随机推荐

  1. ucenter 单点登录,终极版

      一 ,discuz ecshop  两边登陆都可以同步登陆到另一程序上,但退出则无法实现同步登陆.顺着 Ecshop 的退出流程,顺藤摸瓜找到了 lib_common.php 文件中的 uc_ca ...

  2. New Adventure----GUI Design Studio

    新建项目工程    File->New Project 新建设计文件    Project->New Design 单个设计文件的页面,F9运当前设计页面   页面控件中有绿色包围的控件为 ...

  3. 关于SESSION失效和关闭浏览器问题

    关闭浏览器和session失效没有任何关系, session本身有一个存活时间,在tomcat中默认的是30分钟, 这也就是楼上说的不是马上失效   但和浏览器不要划等号 因为即使你浏览器一直开着,如 ...

  4. TextView 实现跑马灯效果

    在String.xml中添加: <string name="txt">跑马灯效果,我跑啊跑</string>在layout/mian.xml中添加TextV ...

  5. mysql之 日志体系(错误日志、查询日志、二进制日志、事务日志、中继日志)

    一. mysql错误日志:错误日志记录的事件:a).服务器启动关闭过程中的信息b).服务器运行过程中的错误信息c).事件调试器运行一个事件时间生的信息d).在从服务器上启动从服务器进程时产生的信息lo ...

  6. css3 linear-gradient渐变效果及兼容性处理

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. Eclipse中如何显示代码行

    方法一 快捷键方式: 按住 Ctrl + F10 选择 show  Line Numbers 方法二 手动操作: Window -- Prefences -- General -- Editors - ...

  8. 仿flash轮播

    <!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title> ...

  9. shell多进程

    之前需要多进程程序都是python实现,闲来无事弄了下shell多进程,发现so easy(笑哭) 代码上: #!/bin/bash sleep 10 & sleep 5& wait ...

  10. RabbitMQ分布式消息队列服务器(一、Windows下安装和部署)

    RabbitMQ消息队列服务器在Windows下的安装和部署-> 一.Erlang语言环境的搭建 RabbitMQ开源消息队列服务是使用Erlang语言开发的,因此我们要使用他就必须先进行Erl ...