04.歌单==>歌曲数据请求==>传给audio

模式

点击对应进入歌单

触发click事件selectItem

歌单、歌手、排行点击item分别出发的vuex mutations事件

以下以recommend为例

created() {
    this._getRecommend()
    this._getDiscList()
},
methods: {
    selectItem(item) { //点击歌单进入列表页面
      this.$router.push({
        path: `/recommend/${item.dissid}`
      })
      this.setDisc(item)
    },
    _getRecommend() { // slider轮播
      getRecommend().then((res) => {
        if (res.code === ERR_OK) {
          this.recommends = res.data.slider
        }
      })
    },
    _getDiscList() {  // 歌单
      getDiscList().then((res) => {
        if (res.code === ERR_OK) {
          this.discList = res.data.list
          // console.log(res.data.list)
        }
      }).catch((err) => {
        console.log(err)
      })
    },

在dics组建中，mapGetters获得disc数据

再请求歌曲列表

此时的songs是带有url的songs，然后再disc组件把songs传到musiclist组件

再到music-list组件，

点击派发事件到musiclist，传item(歌)，index（索引）

music-list负责具体

actions下

当vuex中有数据后
在player中就可以通过Getters获得currentSong在赋给audio，然后audio.play()播放即可