videojs 怎么在控制条上设置“当前时间”和“剩余时间”?

videojs怎么在控制栏上设置“当前时间”和“剩余时间”呢,如下代表,在controlBar里面设置了“currentTimeDisplay”、“durationDisplay” 但是死活不出来,设置“fullscreenToggle”、“volumePanel”都能生效,是跟什么设置冲突了吗?

```

<template>

<div class="contianer">

<video ref="videoPlayer" id="my-video" class="video-js vjs-default-skin" controls></video>

</div>

</template>


<script>

import 'video.js/dist/video-js.css'

import videojs from 'video.js'

import 'videojs-contrib-hls'


export default {

name: 'HelloWorld',

data () {

return {

player: null,

options: {

textTrackDisplay: false,

posterImage: true,

errorDisplay: false,

controlBar: {

currentTimeDisplay: true, // 当前时间

timeDivider: true, // 时间分割线

durationDisplay: true, // 总时间

progressControl: true, // 进度条

remainingTimeDisplay: true, //

customControlSpacer: true, //

fullscreenToggle: true, // 全屏按钮

volumePanel: false

},

sources: [{

src: 'http://media.w3.org/2010/05/sintel/trailer.mp4',

type: 'video/mp4'

}]

}

}

},

mounted () {

this.player = videojs(this.$refs.videoPlayer, this.options, function onPlayerReady () {})

}

}

}

</script>

```

慕粉4204745
浏览 6501回答 3
3回答
打开App,查看更多内容
随时随地看视频慕课网APP