本人在自学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. 学习笔记TF011:多层神经网络

    线性回归.对数几率回归模型,本质上是单个神经元.计算输入特征加权和.偏置视为每个样本输入特征为1权重,计算特征线性组合.激活(传递)函数 计算输出.线性回归,恒等式(值不变).对数几率回归,sigmo ...

  2. NioSocket相关知识

    一.Nio简介 nio 是non-blocking的简称,在jdk1.4 里提供的新api .Sun 官方标榜的特性如下: 为所有的原始类型提供(Buffer)缓存支持.字符集编码解码解决方案. Ch ...

  3. 互联网金融P2P主业务场景自动化测试

            互联网金融P2P行业,近三年来发展迅速,如火如荼.         据不完全统计,全国有3000+的企业.  “互联网+”企业,几乎每天都会碰到一些奇奇怪怪的bug,作为在互联网企业工 ...

  4. aws上redhat安装redis服务记

    1.准备 官网下载

  5. Cannot be cast to java.lang.Comparable异常

    Set集合中的treeSet问题:cannot be cast to java.lang.Comparable: 原理: Set不保存重复的元素,与Collection类似,只是行为不同,Set是基于 ...

  6. MySql学习笔记(五) —— 存储过程

    存储过程是MySql 5支持的特性,它是一组为了完成特定功能的SQL语句集,经过编译之后存储在数据库中,当需要使用该组SQL语句时用户只需要通过指定储存过程的名字并给定参数就可以调用执行它了,简而言之 ...

  7. 在node.js中如何屏蔽掉favicon.ico的请求

    今天准备用node做个api出来,还没入门,遇到一个小问题,特在此记录一下! 在做路由模块的时候,发现控制台每次都会多输出一条favicon.ico的请求,对于这种又占资源,看着又碍眼的玩意,强迫症完 ...

  8. 这是假的JS——利用CSS Animation实现banner图非交互循环播放

    话不多说,先来张html和css代码截图~ 注意事项: 1.如果想在每张图前进行停顿,可以在keyframes中的每一步前加上一小段与下一张相同的代码: 2.如果想要在实现无违和感的最后一张与第一张的 ...

  9. sock

    头和尾基本用来做校验, 不是拿来做边界的. 头+类型+长度+数据+尾, 这种结构就可以. 拆包就是: 检验头, 然后拆出类型+长度, 然后根据长度拆数据, 然后检验尾巴.

  10. PHP的面向对象 — 封装、继承、多态

    K在上一次的基础篇中给大家介绍了一下关于PHP中数组和字符串的使用方法等,这一次,K决定一次性大放送,给大家分享一下PHP中面向对象的三大特性:封装.继承.多态三个方面的知识. 一.封装 在PHP中, ...