vue如何用vue-video-player插件下载视频

Vue Video Player是一个Vue.js插件，可以帮助我们在网页中方便地播放视频。如果你要使用Vue Video Player插件下载视频，需要进行以下步骤：

1. 安装Vue Video Player插件。在项目目录下使用npm安装Vue Video Player：

   npm install vue-video-player --save

2. 在Vue项目中引入Vue Video Player插件。在Vue组件中引入Vue Video Player并注册：

   <template>
     <video-player ref="videoPlayer" :options="playerOptions" @ended="videoEnd"></video-player>
   </template>
   
   <script>
   import VideoPlayer from 'vue-video-player'
   import 'video.js/dist/video-js.css'
   import 'vue-video-player/src/custom-theme.css'
   
   export default {
     components: {
       VideoPlayer
     },
     data () {
       return {
         playerOptions: {
           autoplay: false,
           controls: true,
           sources: [{
             type: "video/mp4",
             src: "your_video_url.mp4"
           }]
         }
       }
     },
     methods: {
       videoEnd () {
         console.log('video end')
       }
     }
   }
   </script>

3. 在playerOptions中，将sources的src属性设置为你要下载的视频的URL地址。

4. 在methods中编写下载视频的代码，例如：

   methods: {
     downloadVideo () {
       let videoUrl = this.playerOptions.sources[0].src
       let videoName = 'video.mp4'
       let a = document.createElement('a')
       a.href = videoUrl
       a.download = videoName
       a.click()
     }
   }

这段代码会创建一个a标签，设置href和download属性，然后模拟点击a标签进行下载。

5. 在页面中添加一个下载按钮，调用downloadVideo方法即可完成视频下载。

   <button @click="downloadVideo()">下载视频</button>