vue-video-player显示进度条

要在vue-video-player中显示进度条，可以使用插件自带的控制条。控制条中包含了进度条，可以通过设置控制条的属性来控制进度条的显示。

以下是一个简单的例子，演示如何在vue-video-player中显示进度条：

<template>
  <div>
    <video-player ref="videoPlayer" :options="playerOptions"></video-player>
 </div>
</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: {
        controls: true, // 显示控制条
        autoplay: false,
        sources: [{
          src: 'http://example.com/path/to/video.mp4',
          type: 'video/mp4'
        }]
      }
    }
  }
}
</script>

在上面的例子中，我们设置了控制条的属性`controls`为`true`，这样就会在视频播放器下方显示控制条，其中包含了进度条。