import { onMounted, onUpdated, Teleport, defineComponent, renderSlot } from 'vue'; import { useMountedState, useState } from "./index"; const Content = defineComponent({ name: 'Content', props: { contentMounted: { type: Function, default: () => { } }, contentUpdated: { type: Function, default: () => { } }, }, emits: [ 'onContentMounted', 'onContentUpdated', ], setup(props, ctx) { onMounted(() => props.contentMounted()); onUpdated(() => props.contentUpdated()); return () => { // @ts-ignore const children = ctx.slots?.default(); return (<> {children} ); }; } }); // 参考：https://github.com/ryanseddon/react-frame-component export const Frame = { name: 'Frame', props: { mountTarget: { type: String }, contentMounted: { type: Function, default: () => { } }, contentUpdated: { type: Function, default: () => { } }, initialContent: { type: String, default: '

' } }, IntrinsicAttributes: true, setup(props, ctx) { const [node] = useState(null); const isMounted = useMountedState(); const getDoc = () => { return node.value ? node.value.contentDocument : null; }; const getMountTarget = () => { const doc = getDoc(); if (props.mountTarget) { return doc?.querySelector(props.mountTarget); } return doc?.body.children[0]; }; return () => { const renderFrameContents = () => { if (!isMounted()) { return null; } const doc = getDoc(); if (!doc) { return null; } const win = doc.defaultView; if (doc.body.children.length < 1) { doc.open('text/html', 'replace'); doc.write(props.initialContent); doc.close(); } const contentMounted = props.contentMounted; const contentUpdated = props.contentUpdated; const mountTarget = getMountTarget(); // @ts-ignore return ( {renderSlot(ctx.slots, 'head')}

{renderSlot(ctx.slots, 'default')}

); }; return (); }; } }; export default function useFrame() { } //# sourceMappingURL=useFrame.jsx.map