gaoluyang
2026-06-24 c0cb161bb52ce0fbdce5c66ec391d107c75e2452
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
<script setup lang="ts">
import { onMounted, ref } from 'vue';
 
interface IFrameProps {
  /** iframe 的源地址 */
  src: string;
}
 
defineProps<IFrameProps>();
 
const loading = ref(true);
const height = ref('');
// @ts-expect-error: composable typing does not preserve this node schema exactly
const frameRef = ref<HTMLElement | null>(null);
 
function init() {
  height.value = `${document.documentElement.clientHeight - 94.5}px`;
  loading.value = false;
}
 
onMounted(() => {
  setTimeout(() => {
    init();
  }, 300);
});
</script>
 
<template>
  <div v-loading="loading" :style="`height:${height}`">
    <iframe
      ref="frameRef"
      :src="src"
      class="h-full w-full"
      frameborder="no"
      scrolling="auto"
    ></iframe>
  </div>
</template>