vue iframe子頁面–父級頁面間方法調用

(1)子頁面調用父頁面的方法

父頁面
created() {
  var _this = this
  //這里可放到全局,提供給子 iframe 調用
  window.addTab = function(obj){
    return TabUtil().addTab(obj)
  }
}
子頁面調用
window.parent.addTab(obj)

(2)父頁面調用子頁面的方法

子頁面
created() {
     var _this = this
     //這里可放到全局
     window.resizeWindow = function() {
        return _this.resizeWindow()
    }
},
methods: {
    //窗口變化處理
    resizeWindow () {
      console.log('頁面在變化')
    }
}
父頁面調用
var iframe_home = document.querySelector('#iframe_home')
iframe_home.contentWindow.resizeWindow()

iframe_home : iframe標簽id

(3)子頁面獲取父頁面對象

var parent = window.parent.document.querySelector('#mask-div')

(4)父頁面獲取子頁面對象

var iframe = document.querySelector('#iframe_home')
var children = iframe.contentWindow.document.querySelector('#children')
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容