vue iframe 另1个vue打包文件页面，但加载的时候需要等很长时间，怎么可以获取另1个vue页面加载完了？

  • Z时代
  • 2024-02-05
  • 分类：IT

vue iframe 另1个vue打包文件页面，但加载的时候需要等很长时间，怎么可以获取另1个vue页面加载完了？

vue iframe 另1个vue打包文件页面，但加载的时候需要等很长时间，怎么可以获取另1个vue页面加载完了？

应该怎么做？

回答：

我的解决方法：

第1步：

// 获取到iframe的页面
    const iframe = window.frames['iframeName']
    if (iframe) {
      // IE浏览器，判断iframe是否加载完成
      if (iframe.attachEvent) {
        iframe.attachEvent('onload', () => {
          // 加载完成
          loading.value = false // 这里如果已经获取到内页页面，关闭外层loading
        })
      } else {
        // 其他浏览器，，判断iframe是否加载完成，如Chrome、edge、safira
        iframe.onload = (e) => {
          // 加载完成
          loading.value = false // 这里如果已经获取到内页页面，关闭外层loading
        }
      }
    }

如果第1步已经获取内页的内容后（也就是iframe.onload时），外层的Loading已经关闭了。

第2步：
iframe内页的加载，是由内页的接口和代码判断是否显示或关闭 内页的loading,

思路是2层loading，外层和内页各1个。

回答：

这个laoding完全可以在iframe里面去做，外层不需要感知

回答：

    <iframe frameborder="0" :src="REDRICT_PATH" @load="handlerLoad"></iframe>
    <div class="loading-box" v-show="showLoading">
      <img :src="Loading">
    </div>
    // showLoading: true

如图搞定,
让 loading 浮在 iframe 上面,
或者设置 css 做背景图,
onload 之后取消就好了,

以上是 vue iframe 另1个vue打包文件页面，但加载的时候需要等很长时间，怎么可以获取另1个vue页面加载完了？ 的全部内容， 来源链接： utcz.com/p/934914.html

回到顶部