Skip to content

Micheal987/netease-cloud-music-improvement

Repository files navigation

netease-cloud-music-improvement

问题 问题1:切换歌单视图没更新 ​ 原因:已经在create中请求了数据只会触发一次

​ 解决方法: 使用watch监听路由传递过来的id值,如果发生变化就重新获取数据

songid(newval, oldval) { if (newval != oldval) { this._getContentOfSongList(newval); this._handleComments(); } }, 问题2:点击热门搜索会使列表关闭 ​ 原因:事件冒泡了

​ 解决方法:使用事件修饰符 .stop 止住事件冒泡

问题3:mounted 里面获取不到this,$refs .xx ​ 原因:在某个DOM节点使用了v-if、v-show或者v-for(即根据获取到的后天数据来动态操作DOM,即响应式),那么这些DOM不会再mounted阶段中找到的。

​ 扩展:updata每一次的dom解构更新都会调用一次updata钩子函数。而mounted只会调用一次。

问题4:没版权的歌曲不会播放也不会跳转下一首(X) ​ 待解决中

问题5:进度条拉都最后面没歌词会报错(X) ​ 待解决中

screenfull 插件使用方法 首先安装 npm install screenfull --save 在使用.vue文件中 引入 import screenfull from 'screenfull' 在按钮方法中调用 screenfull.toggle() 还可以检测全屏状态 screenfull.isFullscreen 测试浏览器是否支持全screenfull screenfull.isEnabled API .request(ele) 全屏 .exit() 退出全屏 .toggle() 切换全屏 .on(event, function) : event为 ‘change’ | ‘error’ 注册事件 .off(event, function) : 移除前面已经注册的事件 .element: 返回一个全屏的dom节点,如果没有就为 null .isFullscreen : 是否是全屏状态 .isEnabled : 判断是否支持全屏 后续补充和完善计划 ​ 1.完善歌词滚动效果

​ 2.无版权歌曲跳过

​ 3.歌单收藏与新建

​ 4.增加喜欢歌曲功能

​ 5.增加歌手详细页

​ 6.使用混入mixin优化重复性代码

!!!