iframe嵌套h5页面

关于如果向父页面iframe传值，或获取子页面值

<template>
  <d2-container>
    <div>
      <iframe
        :src="url"
        id="mobsf"
        frameborder="0"
        style="visibility: visible;"
      ></iframe>
    </div>
  </d2-container>
</template>
<script>
import Bus from '@/utils/Bus'
import { mapState, mapActions } from 'vuex'
export default {
  data() {
    return {
      url: '',
      iframeData: {
        id: 0
      }
    }
  },
  watch: {
    iframeData: {
      deep: true,
      immediate: true,
      handler(data) {
      // 获取子页面传过来的值
        window.addEventListener(
          'message',
          function(e) {
            if (e.data === true) {
              const tagName = `/paymentInfo?id=${data.id}`
              Bus.$emit('sendMsg', tagName)
            }
          },
          false
        )
      }
    }
  },
  mounted() {
    setTimeout(async () => {
      const id = this.$route.query.id
      this.iframeData.id = id
      const row = await this.$api.GET_CHECK_PROCEED()
      this.url =
        'http://XXXX?id=' +id +'&appId=' + row.appId + 
      this.changeMobsfIframe()
    }, 1000)
  },

  methods: {
    ...mapActions('d2admin/page', ['close']),
    /**
     * iframe-宽高自适应显示
     */
    changeMobsfIframe() {
      var url = 'https://test-website-mall.icihai.cn'
      // 父页面向子iframe传值
      const mobsf = document.getElementById('mobsf')
      mobsf.contentWindow.postMessage(url, '*')
      const deviceWidth = document.body.clientWidth
      const deviceHeight = document.body.clientHeight
      mobsf.style.width = Number(deviceWidth) - 220 + 'px' 
      mobsf.style.height = Number(deviceHeight) - 80 + 'px' 
    }
  }
}
</script>

<style></style>