网易云音乐(移动端)

项目介绍前后端分离,前端用Js,HTML,CSS,Vue(Element组件,Vant组件) Vuex,Vue-router  Jquery,功能来完善项目的制作,后端用的是网易云的API地址来实现获取数据进行页面渲染。音乐app的主要功能功能如下。

 1,首先是主界面视图的展示,轮播和滑动使用的vue的Vant组件实现功能

 2,登录前端功能获取你的账号密码并提交给网易云实现登录成功

 3,歌单详情页和歌曲的展示点击想听的歌曲并进行播放.

4,播放的歌曲和歌词部分和上下首的切换功能等,点击磁盘切换歌词部分。

                        

 

 

5,还有必要的一个功能就是搜索,在搜索界面点击切换歌曲保留搜索历史等功能

1

上面是页面的功能,代码如下!

1,首先是网易云音乐所有的Vue组件展示

2,跳转页面用到的Vue-router (路由)

 3,Vant组件的使用导出getVant函数在main.js全局引用后在组件中就可以直接使用Vant组件了

 

4, 在组件需要的数据存放在了Vuex里下面代码

State部分

 Mutations部分

Actions部分

 5,播放当前位置歌词和歌词时间的处理

在写这个项目的时候就用到了这些页面元素比较简单组件化开发划分清晰,思路想好了再动手写代码会比较容易的多,Vue组件部分就不说什么了,希望还在学Vue的小伙伴们有点帮助吧,源代码我上传资源了,加油!

  • 0
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值