本文介绍了悦听播放器的使用步骤，包括歌曲搜索、播放、获取封面、评论展示以及播放动画和MV播放。通过详细讲解各个接口的请求地址、方法和参数，展示了如何获取并使用歌曲信息。在歌曲评论部分，提到了如何利用vue的v-for生成评论列表，同时在播放动画部分，解释了如何利用audio标签的事件来实现播放效果。
步骤：
歌曲搜索
歌曲搜索接口
●请求地址:
https://autumnfish.cn/search●请求方法:get
·请求参数: keywords(查询的关键字)响应内容:歌曲搜索结果
服务器返回的数据比较复杂时，获取的时候需要注意层级结构
通过审查元素快速定位到需要操纵的元素
歌曲播放
歌曲url获取
●请求地址:
https://autumnfish.cn/song/url·请求方法:get
·请求参数:id(歌曲id)·响应内容:歌曲的url地址
歌曲id依赖歌曲搜索的结果，对于不用的数据也需要关注
歌曲封面
歌曲详情获取
·请求地址:
https://autumnfish.cn/song/detail·请求方法:get
·请求参数:ids(歌曲id)
响应内容︰歌曲详情，包含封面信息
在vue中通过v-bind操纵属性
本地无法获取的数据，基本都会有对应的接口
歌曲评论
热门评论获取
请求地址:
https://autumnfish.cn/comment/hot?type=o请求方法:get
请求参数:id(歌曲id,type固定为0)响应内容:歌曲的热门评论
在vue中通过v-for生成列表
播放动画
audio标签的play事件会在音频播放的时候触发audio标签的pause事件会在音频暂停的时候触发
通过对象的方式设置类名，类名生效与否取决于后面值的真假
mv播放
mv地址获取
·请求地址:
https://autumnfish.cn/mv/url请求方法: get
请求参数:id (
最低0.47元/天 解锁文章
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
