Iframe child parent pass parameter

1, Parent page to child page （iframe） The ginseng

Parent

Subpage （iframe）

Code ：

//  The parent page passes data to the child page 
 Parent ：

<iframe id="ifm" ref="ifm" :src="interviewFeedBackUrl" frameborder="no" border="0" class="flexItem"></iframe>


mounted () {
    // iframe Send a message after loading , Otherwise, the sub page will not receive message
    this.$refs.ifm.onload = () => {
      // iframe Send a message immediately after loading 
      this.$refs.ifm.contentWindow.postMessage({
        'token': this.token
      }, '*')
    }
}


 Sub level ：

mounted () {
  window.addEventListener("message", this.handleIncomingMessage, false)
},

2, Subpage （iframe） Pass parameters to parent page

Subpage

Parent page

  Code ：

 Sub level 

window.parent.postMessage({msg:'feedback_form_draft'}, '*')

 Parent 

mounted () {
    //  Accept iframe Parameters of 
    window.addEventListener('message', this.handleIncomingMessage, false)
},