diff --git a/src/renderer/plugins/markdown-drawio.ts b/src/renderer/plugins/markdown-drawio.ts
index acd27bd6..9f1cba0d 100644
--- a/src/renderer/plugins/markdown-drawio.ts
+++ b/src/renderer/plugins/markdown-drawio.ts
@@ -73,6 +73,18 @@ const Drawio = defineComponent({
       })
     }
 
+    watch(srcdoc, (val) => {
+      timer && clearTimeout(timer)
+      timer = null
+      if (val) {
+        timer = setTimeout(resize, 1000)
+      }
+    })
+
+    onBeforeUnmount(() => {
+      timer && clearTimeout(timer)
+    })
+
     return () => {
       let drawioFile: Doc | undefined
       if (props.repo && props.path) {
@@ -129,12 +141,13 @@ const Drawio = defineComponent({
             html: srcdoc.value,
             ref: refIFrame,
             onLoad: () => {
+              console.log('xxxy')
               resize()
-              timer = setTimeout(resize, 1000)
             },
             iframeProps: {
               class: 'drawio',
               height: '300px',
+              style: { background: '#fff', },
             },
           })
         ])
@@ -190,7 +203,15 @@ type F = { repo?: string; path?: string; url?: string; content: string }
 
 async function buildSrcdoc ({ repo, path, content }: F) {
   if (!content && repo && path) {
-    content = (await api.readFile({ repo, path })).content
+    try {
+      if (!path.endsWith('.drawio')) {
+        return 'Error: support drawio file only'
+      }
+
+      content = (await api.readFile({ repo, path })).content
+    } catch (error: any) {
+      return error.message
+    }
   }
 
   content = content.replace(/<!--.*?-->/gs, '').trim()
diff --git a/src/renderer/plugins/markdown-luckysheet.ts b/src/renderer/plugins/markdown-luckysheet.ts
index 7e614d94..0574bdd5 100644
--- a/src/renderer/plugins/markdown-luckysheet.ts
+++ b/src/renderer/plugins/markdown-luckysheet.ts
@@ -21,6 +21,10 @@ const logger = getLogger('plugin-markdown-luckysheet')
 const fileExt = '.luckysheet'
 
 function buildSrcdoc (repo: string, path: string, full: boolean) {
+  if (!path.endsWith('.luckysheet')) {
+    return 'Error: support luckysheet file only'
+  }
+
   const lang = getCurrentLanguage() === 'zh-CN' ? 'zh' : 'en'
   const options = { container: 'lucky-sheet', lang, plugins: ['chart'], showtoolbarConfig: { print: false } }
   let onload = ''
@@ -258,7 +262,7 @@ const LuckyComponent = defineComponent({
       debounce: 1000,
       iframeProps: {
         class: 'lucky-sheet',
-        style: 'margin: 0;display:block;height: ' + (full ? `calc(100vh - ${topOffset})` : '500px'),
+        style: 'background: #fff; margin: 0;display:block;height: ' + (full ? `calc(100vh - ${topOffset})` : '500px'),
         width: '100%'
       }
     })