最近在用mint-ui重写一个vue.js音乐App项目，做到播放器模块，感觉挺有意思，记录一下播放器歌曲播放及歌曲切换功能实现方法及原理。
先上一张运行效果图（歌词尚未抓取、播放进度条及时间尚未开发）
所需了解的知识：
vue2.0、vuex（mapGetters、mapMutations等）、H5 audio标签
关键DOM部分：
注：歌曲数据已经事先抓取，并通过vuex管理
实现方法：
使用HTML5的audio标签实现歌曲的播放，currentSong表示当前播放的歌曲，currentSong.url即当前歌曲所在的地址，点击
上一首/下一首触发prev()/next()方法，在对应方法中调用mapMutations映射的方法修改mapGetters获取的歌曲的索引值，从而实现歌曲的切换；
点击播放/暂停按钮触发togglePlaying()方法，在对应方法中调用mapMutations映射的方法修改mapGetters获取的当前歌曲的播放状态，从而实现
歌曲的播放与暂停。
以下只介绍播放及切换功能关键部分，布局样式不做介绍。
必需数据：
截图注释部分为必需数据，不注释部分仅用于控制UI相关，非功能必需：
mapMutations设置：
映射方法，便于在prev()、next()、togglePlaying()中调用，修改播放状态及当前歌曲索引
一、播放功能：
togglePlaying()播放/暂停方法及解释
解释：setPlayingState对应mapMutations中的setPlayingState方法，用于修改播放状态，转入的参数为布尔值，按当前播放状态取反，即可实现歌曲的播放与暂停。
二、歌曲切换功能：
上一首与下一首的方法相似，只是计算当前歌曲索引的方法不一样，因此只展示prev()方法源码
实现效果：
