摘要：
上一节完成了页面的展示及滚动效果，接下来实现歌手列表和歌手索引的联动效果，点击右侧的字母，中间跳转到相应的歌手位置，滑动歌手页面时，右侧的字母列表也随之改变。 打开src/base/listview/index.vue(没有则创建),实现点击跳转 //实现原理： 因为字母列表索引和歌手列表相对应，在 阅读全文
摘要：
上节获取并处理了数据，本节展示数据，展示数据的组件可以抽象出来单独做成一个组件 打开src/base/listview/index.vue(没有的话创建一个)，敲写如下代码 // listview/index.vue <template> //[3] 使用组件 <m-scroll> <ul> //遍 阅读全文
摘要：
歌手页面主要展示歌手列表，外加滚动效果，照例第一步还是要获取到数据。 打开src/api/singer.js文件(没有的话创建该文件)，敲写以下代码 //singer.js //引入必要的文件 import jsonp from '../common/js/jsonp' import {common 阅读全文
摘要：
上节获取到歌单信息，本节遍历数据展示歌单列表，展示没有什么好写的不过是几行css样式的问题，为好的用户体验，添加上一些内容：滚动效果，懒加载及加载loading效果。 打开src/componnents/recommend/index.vue文件,敲写以下代码 <template> <div rec 阅读全文
摘要：
获取轮播图数据使用的是jsonp方法，然而获取歌单列表时，需要带上请求头部信息，此时用jsonp是无法做到的，需要使用node提供的服务器代理来间接获取数据，而axios不仅支持ajax请求，也支持服务器代理请求，接下来完成一次代理请求。 打开cmd命令行，敲写以下命令安装axios npm ins 阅读全文
摘要：
既然上节已经获取到数据，那么本节将使用轮播图展示这些数据，轮播图属于常用组件，可以独立成一个公共组件。 打开cmd命令行安装better-scroll(借助插件实现轮播图，后面也会用到) npm install better-scroll --save-dev 在src/base目录下(没有的话先创 阅读全文
摘要：
jsonp获取数据 为保证应用里的音乐数据是实时的，可以通过抓取QQ音乐的数据达到同步的目的。但是，因为同源策略的限制，不可以直接ajax请求QQ音乐的数据，一个委婉点的方法是通过jsonp获取数据。 在cmd命令行输入以下命令安装jsonp npm install jsonp --save-dev 阅读全文
摘要：
1.重构src目录 尽管官方提供的目录结构可以满足一定的开发需求，但不同的项目可能需要不同的目录结构使得便于管理和开发。以下是重构后的目录： \\src目录 api --网络接口 common --基础文件库，包括基础样式，图标，脚本等 fonts --字体文件 image --图片图标 stylu 阅读全文
摘要：
1.Node安装 登录官网，下载最新版本并安装； 在我的电脑内，执行以下操作：右键->属性->高级->环境变量->系统变量->path 查看是否有node的安装路径，没有的话添加上node的安装路径； 开始->运行->cmd 输入node -v ，出现类似v10.15.3的字样说明安装成功。 2.v 阅读全文