歌曲播放页面的数据vuex管理

1.state.js

 import {playMode} from '@/common/js/config'
 const state = {
   singer:{},
   playing:false,
   fullScreen:false,
   playlist:[],
   sequenceList:[],
   mode:playMode.sequence,
   currentIndex:-1,
 }

 export default state

2.getters.js

 export const singer = state =>state.singer
 export const playing = state => state.playing
 export  const fullScreen = state =>state.fullScreen
 export const playlist = state => state.playlist
 export const sequenctList = state =>state.sequenceList
 export const mode = state =>state.mode
 export const currentIndex =state=> state.currentIndex
 export const currentSong = (state) =>{
   return state.playList[state.currentIndex] ||{ }
 }

3.mutation-types.js

 export const SET_SINGER = 'SET_SINGER'

 export const SET_PLAYING_STATE = 'SET_PLAYING_STATE'

 export const SET_FULL_SCREEN = 'SET_FULL_SCREEN'

 export const SET_PLAYLIST = 'SET_PLAYLIST'

 export const SET_SEQUENCE_LIST = 'SET_SEQUENCE_LIST'

 export const SET_PLAY_MODE = 'SET_PLAY_MODE'

 export const SET_CURRENT_INDEX = 'SET_CURRENT_INDEX'

4.mutations.js

 import * as types from './mutation-types'
 const mutations = {
   [types.SET_SINGER](state,singer){//mutations接收两个参数，第一个是state另外一个是传递过来的值
     state.singer = singer
   },
   [types.SET_PLAYING_STATE](state,flag){
     state.playing = flag
   },
   [types.SET_FULL_SCREEN](state, flag) {
     state.fullScreen = flag
   },
   [types.SET_PLAYLIST](state, list) {
     state.playlist = list
   },
   [types.SET_SEQUENCE_LIST](state, list) {
     state.sequenceList = list
   },
   [types.SET_PLAY_MODE](state, mode) {
     state.mode = mode
   },
   [types.SET_CURRENT_INDEX](state, index) {
     state.currentIndex = index
   },
 }

 export default mutations