vue-video-player加入视频标题
时间: 2023-07-18 07:04:50 浏览: 57
要在Vue Video Player中加入视频标题,可以通过以下步骤实现:
1. 将视频标题存储在Vue组件的data属性中。
2. 在Vue Video Player组件中添加一个插槽(slot),并将视频标题作为插槽内容。
3. 在Vue Video Player组件中使用插槽,将视频标题显示在播放器上方。
下面是一个示例代码:
```html
<template>
<div>
<video-player ref="player" :options="playerOptions">
<template #title>
<h2>{{ videoTitle }}</h2>
</template>
</video-player>
</div>
</template>
<script>
import VideoPlayer from 'vue-video-player'
export default {
components: {
VideoPlayer
},
data() {
return {
videoTitle: 'My Awesome Video',
playerOptions: {
// add your player options here
}
}
}
}
</script>
```
在上面的代码中,我们将视频标题存储在data属性中,并在Vue Video Player组件中添加了一个插槽,将标题作为插槽内容。然后,在使用Vue Video Player组件时,我们使用插槽,并将视频标题显示在播放器上方。