vuepress使用iframe组件嵌入bilibili视频

自制iframe固定比例嵌入bilibili视频 好朋友毛毛的作品，我拿来测试下bilibili视频的嵌入情况。请大家踊跃投币。视频AV号：av90992146。 markdown代码：

    <iframeVideo ihtml="https://player.bilibili.com/player.html?aid=90992146&cid=155380603&page=1&danmaku=0&high_quality=1"></iframeVideo >
    <iframeVideo ihtml="https://player.bilibili.com/player.html?aid=90992146&cid=155380603&page=2&danmaku=0&high_quality=1"></iframeVideo >

提示 以下代码实现了宽高定比例并自适应高度的iframe嵌入方式，原生的iframe组件需要自行输入高宽。

<!--docs/.vuepress/components/iframeComp.vue-->
<template>
    <iframe class="video-iframe" width="100%" v-resize="{ log: true }" frameborder="no" scrolling="no" seamless="" allowfullscreen="allowfullscreen" :src="ihtml"></iframe>
</template>

<script>
  export default {
      props: {
          ihtml: {
              type: String
          }
      },
      mounted(){
            function changeVideoIframe(){
                const video = document.getElementsByClassName('video-iframe');
                const width = document.getElementsByClassName('video-iframe')[0].scrollWidth;
                for(let i = 0;i<video.length;i++){
                    video[i].style.height = width*0.75+'px'
                }
            }
            changeVideoIframe()
            window.onresize = function(){changeVideoIframe()}
      }
  }
</script>

bilibili参数说明

|--|--| |