feat: 初步实现基于iframe的插件的部分逻辑。

src/plugins/miaoIframe/miaoIframe.vue

@@ -1,6 +1,7 @@
 <template>
     <div class="miao-markdown-container-miaomiaomiao">
         <iframe
+            ref="iframeRef"
             :src="iframeSrc"
             frameborder="0"
             class="iframe-container-iframe"></iframe>
@@ -8,17 +9,33 @@
 </template>
 
 <script setup lang="ts">
-import { VirtualFile } from '@/class/VirtualDirectory'
-import { onMounted, ref } from 'vue'
+import VirtualDirectory, { VirtualFile } from '@/class/VirtualDirectory'
+import { cloneDeep } from 'lodash';
+import { inject, onMounted, ref } from 'vue'
+import buildFromTree from '../../hooks/buildFromTree';
 
+const root = inject('rootDirectory') as VirtualDirectory
 const currentFiles = defineModel<VirtualFile[]>('currentFiles', {
     required: true
 })
 
 const iframeSrc = ref<string>()
+const iframeRef = ref<HTMLIFrameElement>();
 
+const sendRootTree = () => {
+    iframeRef.value?.contentWindow && iframeRef.value.contentWindow.postMessage(cloneDeep(root.tree), "*");
+}
+
+const handleIframeMessage = (e: MessageEvent<any>) => {
+    // const data = e.data;
+    sendRootTree()
+}
 onMounted(() => {
     iframeSrc.value = currentFiles.value[0].url
+    if (typeof window.addEventListener != "undefined") {
+      window.addEventListener("message", handleIframeMessage, false);
+    }
+    console.log(buildFromTree(cloneDeep(root.tree)))
 })
 </script>