vue+vant同一项目实现豆瓣电影加网易云音乐webapp-最佳练手项目

摘要：很多小伙伴练手都会去仿写豆瓣电影或者网易云音乐，所以，这回干脆把两个集合起来，具体长什么样，请各位看预览或下面图片啦。怎么折腾法呢比如豆瓣部分我使用了，网易云部分则没有，网易的组件则是自己造的轮子，当然在实际开发中肯定不会这么搞啦。。

很多小伙伴练手都会去仿写豆瓣电影或者网易云音乐，所以，这回干脆把两个集合起来，具体长什么样，请各位看预览或下面图片啦。

做这个项目最主要的目的是为了练习与巩固vue，所以个人是本着怎么折腾怎么来的原则做的。怎么折腾法呢？比如豆瓣部分我使用了vant，网易云部分则没有，网易的ui组件则是自己造的轮子，当然在实际开发中肯定不会这么搞啦。。还有个人平时看过的知识，像createApi啥的会应用上，毕竟看过不如写过嘛，所以通过这么“折腾”的项目，能够学习到很多东西哦，希望能对大家有一点点帮助，有问题也欢迎各位与我交流！！！

主要技术栈 ： vue vuex axios scss vant

网易云音乐接口 ：NeteaseCloudMusicApi这个真好，感谢大佬提供！

源码地址： vue-vant-douban-wangyi 如果各位觉得还不错的话，麻烦给我个start鼓励下哈！！感谢各位！！！

在线预览 请在移动模式下浏览

一 欢迎页 骨架屏

二 电影搜索

三 电影 （列表、详情、影人详情）

四 音乐 （主页、歌单、播放器）

五 收藏 可拖拽mini播放器

0 rem适配

1 欢迎页 骨架屏

2 地区定位 加载地区热映电影 即将上映 top250

3 电影搜索

4 电影详情

5 影人详情

6 跳转到电影网站观看电影

7 电影收藏

8 歌单查看

9 全屏播放器 拖拽mini播放器 歌词滚动

10 ......

1 代码非常整洁

2 如上所述够“折腾”

3 项目结构可拓展性可维护性强

1 歌曲搜索

2 歌曲收藏

3 优化loading （已更新）

1 定位：先使用搜狐，若失败再使用百度地图。
2 优化：loading，从loading指令改成了loading组件。

1 发现歌单背景高斯模糊效果，在小米自带浏览器下过度时卡顿，所以去掉了改了下歌单样式。
2 还是小米自带的浏览器。。修复了获取不了歌曲总长度的bug。
3 修复了歌词过长时文字重叠bug。
4 从一个歌单快速切换到另一个歌单时，可能会出现显示的是前一个歌单的歌曲的情况，所以axios增加请求前先取消前面请求的配置。2019-3-22更新1 加快电影详情滑动速度2 增加手动输入城市

1 加快电影详情滑动速度
2 增加手动输入城市

最后感谢各位！希望给个start鼓励下哦！