video.js 视频播放出错显示图片

官方有个属性设置poster 图片。但是失效

无奈。强行js修改

 <video-player
                ref="videoPlayerHls"
                :playsinline="true"
                :options="videoOption"
                @error="errors($event)"
                class="video-player vjs-custom-skin"
              />
 //视频播放错误
    errors(v) {
      // console.log("v", v);
      v.errorDisplay.close(); //关闭错误提示消息框,太丑了
      let errId = v.id_;
      // console.log("errId", errId);
      //写入图片
      // console.log("errVideoImg", errVideoImg);
      document.getElementById(errId).innerHTML =
        "<img src='" + errVideoImg + "'/>";
      //设置样式
      let imgBox = document
        .getElementById(errId)
        .getElementsByTagName("img")[0];
      let imgStyle = imgBox.style;
      imgStyle.width = "100%";
      imgStyle.height = "100%";
      imgStyle.zIndex = 999;
      imgStyle.position = "absolute";
      imgStyle.top = "5%";
    },

 

posted @ 2021-04-14 09:28  abcByme  阅读(177)  评论(0编辑  收藏  举报