使用ant-design中Carousel加载多个iframe的优化方法

今天小编给大家分享的是使用ant-design中Carousel加载多个iframe的优化方法。小编觉得挺实用的,为此分享给大家做个参考。一起跟随小编过来看看吧。

目前创新互联已为1000+的企业提供了网站建设、域名、网络空间、网站托管、服务器托管、企业网站设计、蒸湘网站维护等服务,公司将坚持客户导向、应用为本的策略,正道将秉承"和谐、参与、激情"的文化,与客户和合作伙伴齐心协力一起成长,共同发展。

项目中遇到用ant-design 的 Carousel 加载很多个iframe,因为一次生成很多iframe,会使浏览器很慢
思路:只在当先显示的项里面加载iframe,其余的都默认加载一个截图,再切换之前用beforeChange改变 变量idx,把即将要显示的内容由图片变成视频
代码如下

js逻辑部分

methods: {
    beforeChange (from, to) {
      // 切换之前把变量idx变成即将要显示的那个项的idx,这样渲染的时候就会渲染iframe,而旧的也会销毁
      this.idx = to
    }
  }

以上就是使用ant-design中Carousel加载多个iframe的优化方法,代码示例简单明了,如果在日常工作遇到此问题。通过这篇文章,希望你能有所收获,更多详情敬请关注创新互联行业资讯频道!


名称栏目:使用ant-design中Carousel加载多个iframe的优化方法
分享路径:http://azwzsj.com/article/gdeejg.html