假设有两个文件

general.vue(这是一个vue多入口生成的实例,会被打包为一个单独的general.html)

generalPage.vue(这个文件通过iframe引入general.html)

那么,如何在general.vue里触发generalPage.vue中的方法vueFun?

方法如下:

1.在general.vue中通过parent.vueFun(params)调用函数

general.vue------------------------------------------------------------------------------------------------------

<template>
  <div class="main-cotent">
    <span @click='checkButtonClick({linktype: item.linktype, type: "a"})'>调用</span>
  </div>   
</template>

<script>
export default {
  name: 'general',
  created () {
  },
  methods: {
      checkButtonClick (params) {
      parent.vueFun(params)
      }
  }
}
</script>

1.在generalPage.vue中,在created中将vueFun 注册为全局即可调用
generalPage.vue------------------------------------------------------------------------------------------------

<template>
  <div class="main-cotent">
    <iframe id="windowiframe" frameborder="no" border="0" src="general.html"></iframe>
  </div>   
</template>

<script>
export default {
  name: 'generalSurvey',
  created () {
    window.vueFun = function (params) {
      alert('hello')
    }

  }
}
</script>

通过 iframe引用的vue文件之间的方法互调相关推荐

  1. vscode 新建php模板,使用VSCode快速创建vue文件模版的方法介绍

    VSCode怎么自定义代码模版?下面本篇文章给大家介绍一下VSCode快速创建vue文件模版的方法.有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助. 修改位置 打开vscode首选项- ...

  2. ibooks打开iframe引用的html文件乱码

    环境:ipad2,ios9.0.2,ibooks4.4(3402) 制作的epub含有某一页有iframe标签,引用的html文件是用utf-8带bom的(二级制EF BB BF开头),但是是用vs2 ...

  3. golang 相互引用_Go 不同文件之间的引用

    同一个包里面,不同文件之间,不需要 import,直接用就好.不同包的话,需要引用包,只能使用大写字母开头的方法 ,变量 等等,小写子母开头的只能包内使用. 简单来说 :大写字母开头的变量,方法暴露给 ...

  4. vue i18n 国际化 使用方法

    1 先安装 npm install vue-i18n 2  新建文件assets/js/i18n.js 3  引入vue-i18n并注册到vue上 import VueI18n from 'vue-i ...

  5. vue引用自定义.js文件 (常量抛出 + 地址三级联动为例)- 语法篇

    文章目录 vue如何引用`自定义封装的` `.js`文件? `如何操作,详细如下.`(注意代码注释部分:注意1/2/3/4/5) 一.效果图预览: 二.以自定义`area.min.js`文件为例: 三 ...

  6. vue引用自定义.css文件 - 语法篇

    vue如何引用外部自定义的.css文件 ? 一般都会因为存在权重或优先级设置的问题才会侧意引用: [详情进入查看:如何在scoped不污染组件样式的前提下,实现el-input组件样式覆盖?] 再者, ...

  7. vue 引用src中的文件_Vue中引用第三方JS文件

    使用Vue时会经常使用jQuery.bootstrap这类第三方工具库,而boostrap的渲染不仅依赖于jQuery js文件的加载,也依赖于HTML中DOM树内容的加载.但Vue中DOM树是有Vu ...

  8. vue,js,html三种文件之间是怎样的关系?

    vue,js,html三种文件之间是怎样的关系? 比如说,我创建一个js文件,vue实例是在js中创建,component组件也是在js中注册, 然后我去html中导入这个JS,这个时候我就可以在ht ...

  9. 从零开始开发一个vue组件打包并发布到npm (把vue组件打包成一个可以直接引用的js文件)

    自己写的组件 有的也挺好的,为了方便以后用自己再用或者给别人用,把组件打包发布到npm是最好不过了,本次打包支持 支持正常的组件调用方式,也支持Vue.use, 也可以直接引用打包好的js文件, 配合 ...

最新文章

  1. apache tomcat 整合
  2. 自从我上了数据结构课之后……
  3. [Java基础]String对象的特点(易错点)
  4. mysql php 变量赋值,在MySQL UPDATE(PHP / MySQL)中使用变量
  5. php怎么给接口里的方法传参,PHP接口中方法的参数和实现类方法中的参数可以不一致的问题...
  6. CSDN博客PDF格式文件导出【转载】
  7. 20135337——Linux内核分析:第十七章 模块与设备
  8. 版本控制、协同开发工具比较
  9. php 多附件上传插件下载,大文件、多文件分片上传插件
  10. 在linux系统下做软raid教程
  11. word模板动态填充并下载
  12. 前端培训丁鹿学堂:vue3之计算数据和watch监听深入
  13. 等级测评——定级、等级划分及测评时间
  14. pages改变文档背景和改变文字背景
  15. html 和css常见的面试题
  16. meta20 无法安装 google play_酷安最新版app-酷安最新版apk下载安装v10.5
  17. 腾讯地图—WebService API定位的使用
  18. 等价无穷小的精度问题
  19. HCIP 证书过期后要怎么重新认证?需要注意什么?
  20. Linux-iptables详解

热门文章

  1. 微信即时通信原理_福州5号线一期通信系统集成中标
  2. 如何对待别人的赞美和批评?
  3. 再说CSS3渐变——线性渐变
  4. 英语听力突破掌上宝Reading
  5. 奔向财富自由之路的10条建议
  6. 01网易首页静态页面笔记(李游精品前端课程)
  7. JavaSE基础加强
  8. 拯救者r720黑苹果_虽然好等,3499的联想拯救者电竞手机,或让黑鲨红魔ROG无法招架...
  9. Lua处理中英文混合字符串
  10. IE 11关闭后提示停止工作