用Vue来实现音乐播放器(二十一):歌手详情数据抓取
第一步:在api文件夹下的singer.js中抛出getSingerDetail方法
第二步:在singer-detail.vue组件中引入api文件夹下的singer.js和config.js
第三步:在singer-detail.vue的方法中调用getSingerDetail方法 这个方法返回一个promise实例 所以要用then 得到获取成功的情况
用Vue来实现音乐播放器(二十一):歌手详情数据抓取的更多相关文章
- Vue慕课网音乐项目随手记--node代理及数据抓取
1.抓取数据 链接 https://y.qq.com/portal/playlist.html Parameters 通过上图能看到,qq音乐通过设置了refer和host来保护接口. 那么怎么才 ...
- vue小练习--音乐播放器
1 首先建一个文件夹 放几首歌曲 2 看代码 1)基本版本 <!DOCTYPE html> <html lang="zh-CN"> <head> ...
- 用Vue来实现音乐播放器(三十八):歌词滚动列表的问题
1.频繁切换歌曲时,歌词会跳来跳去 原因: // 歌词跳跃是因为内部有一个currentLyric对像内部有一些功能来完成歌词的跳跃 //每个currentLyric能实现歌曲的播放跳到相应的位置 是 ...
- Vue实战:音乐播放器(一) 页面效果
先看一下效果图 首页 歌单详情页 歌手列表 歌手详情页 排行页面 榜单的详情页(排序样式) 搜索页面 搜索结果 播放器内核 歌词自动滚动 播放列表 用户中心
- 用Vue来实现音乐播放器(十七):歌手页右侧快速入口实现
快速入口的列表是其实是之前处理的歌手的数据中的关于title的列表 shorcutList属性是计算属性 通过ret数组中的title计算到的 所以我们要在singer.vue组件中将数据传入到l ...
- 汽车之家店铺商品详情数据抓取 DotnetSpider实战[二]
一.迟到的下期预告 自从上一篇文章发布到现在,大约差不多有3个月的样子,其实一直想把这个实战入门系列的教程写完,一个是为了支持DotnetSpider,二个是为了.Net 社区发展献出一份绵薄之力,这 ...
- 用Vue来实现音乐播放器(二十三):音乐列表
当我们将音乐列表往上滑的时候 我们上面的歌手图片部分也会变小 当我们将音乐列表向下拉的时候 我们的图片会放大 当我们将音乐列表向上滑的时候 我们的图片有一个高斯模糊的效果 并且随着我们的列 ...
- 用Vue来实现音乐播放器(二十):Vuex初始化及歌手数据的配置
state:所有组件的所有状态和数据 放入同一个内存空间去管理 我们把它称为state Vue Components:state里面的数据可以方便的映射到组件上 然后渲染组件 Actions:当组件 ...
- 用Vue来实现音乐播放器(十八):右侧快速入口点击高亮
问题一:当我们点击右侧快速入口的时候 被点击的地方高亮 首先我们要知道右侧快速入口是为什么高亮??因为当watch()监控到scrollY的变化了的时候 将scrollY的值和listHeight ...
随机推荐
- 初探 -1 JavaScript
JavaScript 教程 JavaScript 是 Web 的编程语言. 所有现代的 HTML 页面都使用 JavaScript. JavaScript 非常容易学. 本教程将教你学习从初级到高级J ...
- 【vue】canvas验证码组件--数字/数字加字母
基于canvas的数字/数字+字符验证码 SIdentify.vue 组件 <!-- 基于canvas的数字/数字+字符验证码 --> <!-- 调用格式 <s-ident ...
- 在django项目中,单独运行python文件
在from models import * 上面加上以下代码 import os; os.environ.setdefault("DJANGO_SETTINGS_MODULE", ...
- python程序超时处理 timeout_decorator
如下两个例子,实现对某个函数的超时处理(其实就是加了一个装饰器timeout): 成功例子: 代码: import time import timeout_decorator @timeout_dec ...
- Codeforces Round #575 (Div. 3) C. Robot Breakout (模拟,实现)
C. Robot Breakout time limit per test3 seconds memory limit per test256 megabytes inputstandard inpu ...
- canvas 计算文字宽度(常用于文字换行)
var c=document.getElementById("myCanvas"); var ctx=c.getContext("2d"); ctx.font= ...
- mysql 8.0.16 单主 mgr搭建
mysql 8.0.16 单主 mgr搭建 环境介绍: 192.168.142.142 db142192.168.142.143 db143192.168.142.145 db145 1.安装依赖包 ...
- 关于react中context的使用
context是用于组件间数据的传递,就是减少props的使用 具体使用也很简单 第一步设置默认值,第二部用provider发放,第三步使用contextType来接受最近的provider,然后直接 ...
- ubuntu日常
1804 处理 1,修改为固定ip vim /etc/netplan/01-netcfg.yaml network: version: 2 renderer: networkd ethernets: ...
- node.js入门学习(五)--Demo模块化改造
1.node.js中模块的分类 1)node.js内置模块(核心,原生) 所有内置模块在安装node.js时就已经编译成二进制文件,可以直接加载运行(速度较快),部分内置模块,在node.exe这个进 ...