video中视频初始化显示第1帧

1个视频url放入video组件中,页面初始化的时候是黑的
解决办法:

html

<video :src="item.video" class="images-item" controls :id="handleVideoId(index)" />
<canvas id="mycanvas" style="display: none"></canvas>

js

  mounted() {
    this.findvideocover(url);
  },
 methods: {
    handleVideoId(index) {
      return `video${index}`
    },
    findvideocover(url) {
      url.forEach((item, index) => {
        const video = document.getElementById(`video${index}`);
        video.src = item;
        var canvas = document.getElementById("mycanvas");
        const ctx = canvas.getContext("2d");
        video.crossOrigin = "anonymous";
        video.currentTime = 0.5;
        video.oncanplay = () => {
          canvas.width = video.clientWidth;
          canvas.height = video.clientHeight;
          ctx.drawImage(video, 0, 0, video.clientWidth, video.clientHeight);
        };
      });
    },
  },

你可能感兴趣的:(js,video)