Skip to content

Commit

Permalink
feat: iframe expose postmessage function (#3368)
Browse files Browse the repository at this point in the history
* feat: iframe postmessage

iframe postmessage

* chore: prettier format code

---------

Co-authored-by: invalid w <wangjuesix@gmail.com>
  • Loading branch information
luocong2016 and wangjue666 authored Dec 1, 2023
1 parent cd71e60 commit 05bc4ac
Showing 1 changed file with 30 additions and 1 deletion.
31 changes: 30 additions & 1 deletion src/views/sys/iframe/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -12,13 +12,14 @@
</template>
<script lang="ts" setup>
import type { CSSProperties } from 'vue';
import { ref, unref, computed } from 'vue';
import { ref, unref, computed, onMounted, onUnmounted } from 'vue';
import { Spin } from 'ant-design-vue';
import { useWindowSizeFn } from '@vben/hooks';
import { propTypes } from '@/utils/propTypes';
import { useDesign } from '@/hooks/web/useDesign';
import { useLayoutHeight } from '@/layouts/default/content/useContentViewHeight';
const emit = defineEmits(['message']);
defineProps({
frameSrc: propTypes.string.def(''),
});
Expand Down Expand Up @@ -54,6 +55,34 @@
loading.value = false;
calcHeight();
}
const messageHandler = (e: MessageEvent) => {
emit('message', e.data);
};
const postMessage = (message: any, tragetOrigin: string, transfer?: Transferable[]) => {
const iframe = unref(frameRef);
if (!iframe) return;
iframe.contentWindow?.postMessage(message, tragetOrigin, transfer);
};
const reload = () => {
loading.value = true;
const iframe = frameRef.value;
if (!iframe) return;
iframe.contentWindow?.location.reload();
loading.value = false;
};
onMounted(() => {
window.addEventListener('message', messageHandler);
});
onUnmounted(() => {
window.removeEventListener('message', messageHandler);
});
defineExpose({ postMessage, reload });
</script>
<style lang="less" scoped>
@prefix-cls: ~'@{namespace}-iframe-page';
Expand Down

0 comments on commit 05bc4ac

Please sign in to comment.