Skip to content

VideoEmbed 视频嵌入组件

VideoEmbed 是一个用于嵌入主流视频平台内容的 Vue 组件,支持 Bilibili 和 YouTube 视频嵌入。

组件链接:minorcell/cellstack

注意

当前仅支持 Bilibili 和 YouTube 视频平台。

使用方法

vue
<VideoEmbed
  url="视频链接"
  title="视频标题(可选)"
  width="100%"
  height="315"
  aspect-ratio="16:9"
/>

使用示例

基础使用

vue
<VideoEmbed url="https://www.bilibili.com/video/BV1GJ411x7h7" />

自定义尺寸

vue
<VideoEmbed
  url="https://www.youtube.com/watch?v=dQw4w9WgXcQ"
  width="800"
  height="450"
/>

设置标题

标题一般用于描述视频内容,如视频标题。

【官方 MV】Never Gonna Give You Up - Rick Astley
vue
<VideoEmbed
  url="https://www.bilibili.com/video/BV1GJ411x7h7"
  title="【官方 MV】Never Gonna Give You Up - Rick Astley"
/>

参数说明

参数类型必填默认值说明
urlString-视频平台链接,在视频平台分享时获取
titleString""视频标题
widthString/Number"100%"播放器宽度
heightString/Number315播放器高度
aspect-ratioString"16:9"宽高比

累计访问