在Vue中设置字幕时间可以通过以下步骤实现:
1. 在Vue组件中引入video.js
```
import videojs from 'video.js'
import 'video.js/dist/video-js.css'
```
2. 在Vue组件的mounted钩子函数中初始化视频播放器
```
mounted() {
this.player = videojs('my-video', {
controls: true, // 显示控制条
fluid: true, // 响应式
playbackRates: [0.5, 1, 1.5, 2], // 播放倍速
muted: false // 静音
}, function onPlayerReady() {
console.log('Player is ready!')
})
}
```
3. 在字幕文件中设置时间轴
```
WEBVTT
00:00.000 --> 00:01.000
Hello World!
00:03.000 --> 00:04.000
This is a demo.
00:05.000 --> 00:06.000
Thanks for watching!
```
4. 在Vue组件的methods钩子函数中添加字幕
```
addCaption() {
const track = this.player.addRemoteTextTrack({
kind: 'captions',
label: 'English',
srclang: 'en',
src: '/path/to/caption.vtt'
}, false)
track.mode = 'showing' // 设置字幕模式
}
```
以上是Vue设置字幕时间的方法,具体细节实现可以根据自己的项目需求进行适当调整。