vue2.0音乐播放器

上手vue.js之后，选择的第一个项目就是音乐播放器，使用qq音乐的api，界面仿腾讯本地音乐播放器“轻听”，功能包括最近播放、添加到喜欢、榜单详情、歌手详情、专辑详情。技术栈基本是vue全家桶，vue-router、vuex、es6特性（正在学习中）、webpack、express......

源码

写了很多注释，方便大家参考学习：?github

项目预览：?轻听欢迎大家来star~

高清无码预览图

技术栈

vuex：用来数据管理真的是一级棒，合理的使用组件的状态共享会事半功倍
better-scroll：号称移动端最好用的滚动插件，的却很好用，效果很棒
webpack：用来打包、压缩，页面的懒加载可以提升第一次打开的加载速度
good-Storage：封装了localStorage，方便使用，保存用户的喜欢列表，搜索历史

总结

数据绑定：vue的响应式系统是基于数据驱动的，计算属性会根据数据的改变而改变DOM节点。节点和计算属性都依赖于数据，处理好这些依赖关系很重要。比如项目中的，添加歌曲到我喜欢，最近播放，删除搜索历史，歌曲切换都会根据数据的改变而改变DOM节点。
组件化：把一个应用拆分成多个组件，各组件有机结合，抽象出基础组件，提高编码效率
数据抓取：qq音乐的api还是挺明显的，用chrome就可以很容易获得。一般带fcg的就是了

【声明】本项目仅供学习交流，请不要用做任何商业用途，有问题请联系作者

此项目将持续更新完善......敬请关注

vue2.0音乐播放器相关推荐

【Vue2】音乐播放器
[Vue2]音乐播放器需求: 1.输入关键词发起axios请求,获取播放列表 2.点击播放按钮,根据点击的数据id值,发起axios请求获取音频播放路径,并在<audio>标签下的src ...
Android 简单音乐播放器开发
我把我最新的版本可以定时关闭,界面做了很大优化.GitHub上需要的可以下载: https://github.com/DhyanaCoder/IMusic ------------------- ...
Android音乐播放器的开发实例（2021新版-Java版）
Android音乐播放器的开发实例介绍该项目旨在引导喜爱 Android 开发爱好者入门教程实例,可以一步一步的跟着来完成属于自己的项目开发过程. 此项目为基于 Java 语言开发,使用 Recy ...
Vue2仿网易云风格音乐播放器（附源码）
Vue2仿网易云风格音乐播放器 1.整体效果 2.使用技术 3.实现内容 4.源码 5.使用图片 1.整体效果 2.使用技术使用了HTML5 + CSS3进行页面布局及美化使用Vue2进行数据渲染 ...
20230621----重返学习-仿QQ音乐播放器-静态页面的免费部署-vue2
day-096-ninety-six-20230621-仿QQ音乐播放器-静态页面的免费部署-vue2 仿QQ音乐播放器 audio音频标签 audio标签 <audio src="i ...
安卓实训项目：基于储存卡音乐播放器实训报告5.0
安卓实训项目:基于储存卡音乐播放器实训报告5.0 (一)功能要求在基于存储卡音乐播放器V0.4基础上,作如下修改: 1.创建应用程序常量接口保存广播频道常量 2.在音乐播放器应用程序类里添加两个属性 ...
安卓实训项目：基于储存卡音乐播放器实训报告4.0
功能要求在基于存储卡音乐播放器V0.3基础上,作如下修改: 1.创建方法能扫描存储卡上所有mp3文件(采用递归算法) ----完成 2.用自定义应用程序类存放全局数据和方法 ----完成 3.利用异 ...
安卓实训项目：音乐播放器3.0——实训报告3
一.功能要求在基于存储卡音乐播放器V0.2基础上,增加功能: 添加一个音乐播放列表(显示歌名) – 单击某一首音乐就立刻播放,播放进度清零,显示当前音乐的播放时长. 添加一个[上一首]与[下一首]按 ...
Android Studio实现音乐播放器2.0
项目目录一.引言二.项目概述 1.需求分析 2.设计分析 3.资源文件分析三.开发环境四.优化设计 1.上一首下一首 2.个性化按钮五.运行效果六.项目总结七.源码获取一.引言我在一 ...

vue2.0音乐播放器

源码

高清无码预览图

技术栈

总结

此项目将持续更新完善......敬请关注

vue2.0音乐播放器相关推荐

最新文章

热门文章