<p style="text-align: left">本文实例为大家分享了关于Player播放器组件的具体内容,供大家参考,具体内容如下
<p style="text-align: center">
<p style="text-align: left">迷你播放器:
<p style="text-align: center">
1.播放器组件会在各个页面的情况下会打开。 首先在vuex state.js 中定义全局的播放器状态
singer:{},playing:false,//是否播放
fullScreen:false,//是否全屏
playList:[],//播放列表
sequenceList:[],// 非顺序播放列表
mode:playMode.sequence,// 播放模式(顺序0,循环1,随机2)
currentIndex:-1,//当前播放索引
}
export default state
// config.js
export const playMode = {
sequence:0,loop:1,random:2
}
2.进入播放器页面时获取播放列表数据,改变播放状态 在music-list列表中打开
在song-list 组件中派发事件到父组件,传入当前歌曲的信息和索引
selectItem(item,index){
this.$emit('select',item,index)
},