通过 iframe引用的vue文件之间的方法互调
假设有两个文件general.vue(这是一个vue多入口生成的实例,会被打包为一个单独的general.html)generalPage.vue(这个文件通过iframe引入general.html)那么,如何在general.vue里触发generalPage.vue中的方法vueFun?方法如下:1.在general.vue中通过parent.vueFun(params)...
假设有两个文件
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>
更多推荐
所有评论(0)