iframe嵌套h5页面

最新推荐文章于 2025-04-25 14:24:30 发布

郭芊淳

最新推荐文章于 2025-04-25 14:24:30 发布

阅读量981

点赞数

分类专栏： vue H5移动端文章标签： javascript 前端 vue.js

本文链接：https://blog.youkuaiyun.com/weixin_43464372/article/details/129046957

版权

该文章展示了在Vue.js应用中如何实现父页面向iframe传递数据以及从子页面接收数据的过程。使用了Vuex进行状态管理，通过`postMessage`方法进行跨窗口通信，并监听`message`事件来接收子页面的值。同时，文章还涵盖了动态加载iframe的内容和调整iframe的宽高以适应屏幕尺寸的方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

关于如果向父页面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