Dplayer弹幕播放器如何异步初始化

Question

data() {
    return {
      options: {},
    }
  },
created() {
    getCourseById(this.userid).then(response => {
      let danmakuId = this._getDanmakuId(this.videos[0].videoLink)
      this.options = {
        video: {
          url: this.videos[0].videoLink,
          pic: this.videos[0].videoLink + '?vframe/jpg/offset/0'
        },
        danmaku: {
          id: danmakuId,
          api: BASE_UTL + '/video/addBarrage/',
          token: this.token,
          user: this.userid
        }
      }
      setTimeout(() => {
        this.dp = this.$refs.player.dp
      })
    })

异步初始化视频无法正确加载，初始化比异步数据之前执行，如果让视频初始化也异步执行，会报错，弹幕无法正常加载

TypeError: Cannot read property 'map' of undefined
    at DPlayer.min.js:1

Answer 1

解决方案，异步初始化播放器
并不是像问题描述的异步初始化播放器才报错
由于用的vue-dplayer中的组件，但是vue-dplayer组件不支持最新版本
所以会报错报错

TypeError: Cannot read property 'map' of undefined
    at DPlayer.min.js:1