Vue中使用iframe 、加载完成后回调事件

snows_l

已于 2023-07-04 12:30:19 修改

阅读量5.9k

点赞数 5

分类专栏： js 前端开发文章标签：前端 javascript html

于 2022-11-18 14:23:36 首次发布

本文链接：https://blog.csdn.net/snows_l/article/details/127921558

版权

前端开发同时被 2 个专栏收录

21 篇文章 1 订阅

订阅专栏

16 篇文章 0 订阅

订阅专栏

template:

<div v-if="qrcodeShow" class="qr-warp-box" v-loading="iLoading">
      <iframe :src="qrUrl" style="width: 100%; height: 300px" frameborder="0" scrolling="no" ref="iframe"></iframe>
</div>

script:

// vue生命周期钩子函数 -- 更新之后
updated() {
  if (this.$refs.iframe) {
    // IE
    if (this.$refs.iframe.attachEvent) {
      this.$refs.iframe.attachEvent('onload', () => {
        // 加载成功
        this.iLoading = false;
      });
    } else {
      this.$refs.iframe.onload = () => {
        // 加载成功
        this.iLoading = false;
      };
    }
  }
},

vue中iframe的 postMessage message的使用,以及一些小问题_snows_l的博客-CSDN博客https://blog.csdn.net/snows_l/article/details/131532067?spm=1001.2014.3001.5501