用Vue来实现音乐播放器（三十八）：歌词滚动列表的问题

【用Vue来实现音乐播放器（三十八）：歌词滚动列表的问题】的更多相关文章

用Vue来实现音乐播放器（十八）：右侧快速入口点击高亮

问题一:当我们点击右侧快速入口的时候被点击的地方高亮首先我们要知道右侧快速入口是为什么高亮??因为当watch()监控到scrollY的变化了的时候将scrollY的值和listHeight相比较判断scrollY在哪个group区间从而判断高亮的currentIndex 所以要想高亮就要让scrollY变化但点击右侧快速入口的时候我们没有有scroll方法直接走的scrollTo方法所以无法派发scroll事件触发scrollY的变化所以我们要手…

用Vue来实现音乐播放器（十六）：滚动列表的实现

滚动列表是一个基础组件他是基于scroll组件实现的在base文件夹下面创建一个list-view文件夹里面有list-view.vue组件 <template>    <scroll class=&q…

用Vue来实现音乐播放器（十四）：歌手数据接口抓取

第一步:在api文件夹下创建一个singer.js文件返回一个getSingerList()方法使他能够在singer.vue中调用 import jsonp from '../common/js/jsonp.js' import {commonParams,options} from './config.js' export function getSingerList() { const url = 'https://c.y.qq.com/v8/fcg-bin/v8.fcg' cons…

用Vue来实现音乐播放器（十五）：处理得到的歌手数据

之前得到的歌手数据是用forEach遍历添加的没有顺序性我们希望得到的数据是title:"热门"的数据在最上面 title为字母的数据按字母从低到高顺序排列 var hot=[] var ret=[] for(let key in map){ let val=map[key] //在对象map中键为key 对应的键值 if(val.title.match(\[a-zA-Z]\)){ ret.push(val) }else if(val.title==="热门&qu…

Android应用--简、美音乐播放器获取专辑图片（自定义列表适配器）

Android应用--简.美音乐播放器获取专辑图片(自定义列表适配器) 2013年7月3日简.美音乐播放器开发第二阶段已增加功能: 1.歌词滚动显示 2.来电监听 3.音量控制 4.左右滑动切换歌词与专辑界面今天要介绍的功能是获取音乐专辑封面并显示到界面上,小巫改变了音乐列表的布局,为了显示专辑封面.之前没有意识到SimpleAdapter已经不能满足自己的需求了,后来只能参考了别人的代码,修改了原来代码,最终实现获取专辑图片.题外话,最近都一直复习大学的考试,所以断断续续地实现功能,不过也…

vue小练习--音乐播放器

1 首先建一个文件夹放几首歌曲 2 看代码 1)基本版本 <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>音乐播放器</title> <meta name="viewport" content="width=device-width ,initial-scale…

用Vue来实现音乐播放器（三十八）：歌词滚动列表的问题

1.频繁切换歌曲时,歌词会跳来跳去原因: // 歌词跳跃是因为内部有一个currentLyric对像内部有一些功能来完成歌词的跳跃 //每个currentLyric能实现歌曲的播放跳到相应的位置是因为它内部有个计时器 //每次currentSong改变的时候都会重新new一个新的lyric-parser出来, //但是我们之前的对象并没有做清理操作也就是说我们之前对象还是有计时器在里面 //所以歌词会来回闪动解决办法: 在切换歌曲之前即getLyric()之前重新去getLyric(…

用Vue来实现音乐播放器（十七）：歌手页右侧快速入口实现

快速入口的列表是其实是之前处理的歌手的数据中的关于title的列表 shorcutList属性是计算属性通过ret数组中的title计算到的所以我们要在singer.vue组件中将数据传入到list-view组件 list-vue 组件在props中接受 shortcut快速入口列表所用到的属性是计算属性通过将singer.vue组件中传入到list-view组件中的数据计算得到将得到的shortcutList数据通过v-for展示在页面效果图如下下面来实现功能 1.点击…

Vue实战：音乐播放器（一）页面效果

先看一下效果图首页歌单详情页歌手列表歌手详情页排行页面榜单的详情页(排序样式) 搜索页面搜索结果播放器内核歌词自动滚动播放列表用户中心…

用Vue来实现音乐播放器（二十一）：歌手详情数据抓取

第一步:在api文件夹下的singer.js中抛出getSingerDetail方法第二步:在singer-detail.vue组件中引入api文件夹下的singer.js和config.js 第三步:在singer-detail.vue的方法中调用getSingerDetail方法这个方法返回一个promise实例所以要用then 得到获取成功的情况…