vue 中引入iframe，動態設置其src,遇到的一些小問題總結

1.重置其樣式，去掉外框以及滾動條等

<iframe
        id="myIframe"
        ref="iframe_a"
        :src="mySrc"
        width="100%"
        height="100%"
        frameborder="no"
        border="0"
        marginwidth="0"
        marginheight="0"
        scrolling="no"
        allowtransparency="yes"
      />

2.在mounted里也找不到iframe 的dom元素，於是用了很笨的辦法去處理，希望路過的大佬可以指點一下，有好的辦法教教我好嗎？？

export default {
  data() {
    return {
      mySrc: '',
      loading: true, // 如果正在加載，就會蓋住展示內容
      timer: null, // 第1個定時器
      timer1: null // 第2個定時器
    }
  },
  mounted() {
    if (this.$refs && this.$refs['iframe_a']) {
      this.setLoading(this.$refs['iframe_a'])
    } else {
      // console.log('延時加載第一次')
      clearTimeout(this.timer1)
      this.timer1 = setTimeout(() => {
        this.setLoading(this.$refs['iframe_a'])
      }, 500)
    }
  },
  destroyed() {
    this.timer = null
    this.timer1 = null
  },
  methods: {
    // 補坑函數1
    setLoading(iframeDom) {
      if (iframeDom) {
        // console.log('找到元素了，執行iframeDom.onload')
        const iframeD = document.getElementById('myIframeWebgl')
        iframeD.onload = () => {
          // console.log('加載完了-----------')
          this.loading = false
        }
        iframeD.src = this.setRoute()
      } else {
        this.setTim()
      }
    },
    // 補坑函數2
    setTim() {
      const iframeD = document.getElementById('myIframe')
      clearTimeout(this.timer)
      this.timer = setTimeout(() => {
        // console.log('延時加載第----次')
        this.setLoading(iframeD)
      }, 200);
    },
  }
}

3.在此之前，加載完成的onload事件有時候不會觸發，點擊頁面有時候沒有反應，地址改了但是頁面沒有變動，於是解決如下：

問題在於： iframe的綁定地址的代碼一定要放在onload下面，要不然就完了
如果使用原生來寫，大概這樣子

let myIframeDiv= document.querySelector('#myIframeDiv')
let iframe = document.createElement('iframe')
iframe.onload = () => {
console.log('這樣子就沒問題了')
}
iframe.src = this.src // 就是這一行代碼，一定要注意哦
myIframeDiv.appendChild(iframe)