fix: copy of dark theme (#328)

doocs · Aug 19, 2024 · fb510ed · fb510ed
1 parent 6b49a13
commit fb510ed
Showing 1 changed file with 40 additions and 38 deletions.
diff --git a/src/components/CodemirrorEditor/EditorHeader/index.vue b/src/components/CodemirrorEditor/EditorHeader/index.vue
@@ -113,48 +113,50 @@ function copy() {
       toggleDark()
     }
 
-    solveWeChatImage()
-
-    const clipboardDiv = document.getElementById(`output`)
-    clipboardDiv.innerHTML = mergeCss(clipboardDiv.innerHTML)
-    clipboardDiv.innerHTML = modifyHtmlStructure(clipboardDiv.innerHTML)
-
-    // 调整 katex 公式元素为行内标签，目的是兼容微信公众号渲染
-    clipboardDiv.innerHTML = clipboardDiv.innerHTML
-      .replace(
-        /class="base"( style="display: inline")*/g,
-        `class="base" style="display: inline"`,
-      )
+    nextTick(() => {
+      solveWeChatImage()
+
+      const clipboardDiv = document.getElementById(`output`)
+      clipboardDiv.innerHTML = mergeCss(clipboardDiv.innerHTML)
+      clipboardDiv.innerHTML = modifyHtmlStructure(clipboardDiv.innerHTML)
+
+      // 调整 katex 公式元素为行内标签，目的是兼容微信公众号渲染
+      clipboardDiv.innerHTML = clipboardDiv.innerHTML
+        .replace(
+          /class="base"( style="display: inline")*/g,
+          `class="base" style="display: inline"`,
+        )
       // 公众号不支持 position， 转换为等价的 translateY
-      .replace(/top:(.*?)em/g, `transform: translateY($1em)`)
+        .replace(/top:(.*?)em/g, `transform: translateY($1em)`)
       // 适配主题中的颜色变量
-      .replaceAll(`var(--el-text-color-regular)`, `#3f3f3f`)
-    clipboardDiv.focus()
-    window.getSelection().removeAllRanges()
-    const range = document.createRange()
-
-    range.setStartBefore(clipboardDiv.firstChild)
-    range.setEndAfter(clipboardDiv.lastChild)
-    window.getSelection().addRange(range)
-    document.execCommand(`copy`)
-    window.getSelection().removeAllRanges()
-    clipboardDiv.innerHTML = output.value
-
-    if (isBeforeDark) {
-      toggleDark()
-    }
+        .replaceAll(`var(--el-text-color-regular)`, `#3f3f3f`)
+      clipboardDiv.focus()
+      window.getSelection().removeAllRanges()
+      const range = document.createRange()
+
+      range.setStartBefore(clipboardDiv.firstChild)
+      range.setEndAfter(clipboardDiv.lastChild)
+      window.getSelection().addRange(range)
+      document.execCommand(`copy`)
+      window.getSelection().removeAllRanges()
+      clipboardDiv.innerHTML = output.value
+
+      if (isBeforeDark) {
+        toggleDark()
+      }
+
+      // 输出提示
+      ElNotification({
+        showClose: true,
+        message: `已复制渲染后的文章到剪贴板，可直接到公众号后台粘贴`,
+        offset: 80,
+        duration: 1600,
+        type: `success`,
+      })
 
-    // 输出提示
-    ElNotification({
-      showClose: true,
-      message: `已复制渲染后的文章到剪贴板，可直接到公众号后台粘贴`,
-      offset: 80,
-      duration: 1600,
-      type: `success`,
+      editorRefresh()
+      emit(`endCopy`)
     })
-
-    editorRefresh()
-    emit(`endCopy`)
   }, 350)
 }
 </script>