fix: 修复importmap动态更新问题

fewismuch · Oct 26, 2023 · 2edce32 · 2edce32
1 parent bd828b2
commit 2edce32
Show file tree

Hide file tree

Showing 4 changed files with 5 additions and 3 deletions.
diff --git a/src/Playground/PlaygroundContext.tsx b/src/Playground/PlaygroundContext.tsx
@@ -41,6 +41,7 @@ export const PlaygroundProvider = (props: { children: React.ReactElement }) => {
     const newFile = {
       [newFieldName]: {
         ...value,
+        language: fileName2Language(newFieldName),
         name: newFieldName
       }
     }

diff --git a/src/Playground/components/Message/index.module.less b/src/Playground/components/Message/index.module.less
@@ -8,7 +8,6 @@
   max-height: calc(100% - 300px);
   min-height: 40px;
   margin-bottom: 8px;
-  font-family: var(--font-code);
   color: var(--color);
   white-space: pre-wrap;
   background-color: var(--bg-color);

diff --git a/src/Playground/components/Output/Preview/index.tsx b/src/Playground/components/Output/Preview/index.tsx
@@ -8,12 +8,13 @@ import type { IPreview, IMessage } from '../../../types'
 interface Props {
   hidden: boolean
   data?: IPreview
+  iframeKey?: string
 }
 
 const iframeUrl = getIframeUrl()
 
 export const Preview: React.FC<Props> = props => {
-  const { hidden, data } = props
+  const { hidden, data, iframeKey } = props
   const iframeRef = useRef<HTMLIFrameElement>(null)
   const [error, setError] = useState('')
 
@@ -42,6 +43,7 @@ export const Preview: React.FC<Props> = props => {
   return (
     <>
       <iframe
+        key={iframeKey}
         ref={iframeRef}
         src={iframeUrl}
         style={{

diff --git a/src/Playground/components/Output/index.tsx b/src/Playground/components/Output/index.tsx
@@ -73,7 +73,7 @@ export const Output: React.FC<IOutput> = props => {
       />
 
       <Preview
-        key={files[IMPORT_MAP_FILE_NAME].value}
+        iframeKey={files[IMPORT_MAP_FILE_NAME].value}
         hidden={activedType !== 'PREVIEW'}
         data={compiledFiles}
       />