切换markdown渲染为unified

src/App.vue

@@ -79,6 +79,23 @@ function onToggleFullWidth(val: boolean) {
   try { localStorage.setItem("editor-full-width", String(val)); } catch { /* noop */ }
 }
 
+// ---- display mode (split / wysiwyg) ----
+type DisplayMode = "split" | "wysiwyg";
+
+function loadDisplayModePref(): DisplayMode {
+  try {
+    const v = localStorage.getItem("editor-display-mode");
+    if (v === "split" || v === "wysiwyg") return v;
+  } catch { /* noop */ }
+  return "split";
+}
+const displayMode = ref<DisplayMode>(loadDisplayModePref());
+
+function onToggleDisplayMode(val: DisplayMode) {
+  displayMode.value = val;
+  try { localStorage.setItem("editor-display-mode", val); } catch { /* noop */ }
+}
+
 onMounted(() => {
   applyZoomCssVars();
   window.addEventListener("wheel", onEditorWheel, { passive: false });
@@ -121,9 +138,8 @@ function onUpdate(md: string) {
 }
 
 function onHeadingClick(heading: { text: string; level: number }) {
-  // Navigate to heading in the CodeMirror editor
-  const className = `.cm-lp-h${heading.level}`;
-  const headingEls = document.querySelectorAll(className);
+  const selector = `.markdown-preview h${heading.level}`;
+  const headingEls = document.querySelectorAll(selector);
   for (const el of headingEls) {
     if (el.textContent?.trim() === heading.text) {
       el.scrollIntoView({ behavior: "smooth", block: "start" });
@@ -267,11 +283,13 @@ listen("menu-event", (event) => {
         :content="content"
         :current-file-path="currentFilePath"
         :is-full-width="isFullWidth"
+        :display-mode="displayMode"
         @heading-click="onHeadingClick"
         @open-folder="onOpenFolder"
         @toggle-folder="onToggleFolder"
         @open-file="onOpenFile"
         @toggle-full-width="onToggleFullWidth"
+        @toggle-display-mode="onToggleDisplayMode"
       />
 
       <!-- Right: Editor area -->
@@ -279,6 +297,7 @@ listen("menu-event", (event) => {
           <MarkdownEditor
             :model-value="content"
             :is-full-width="isFullWidth"
+            :display-mode="displayMode"
             placeholder="输入 Markdown 内容... 支持标题、粗体、斜体、代码块等 ✨"
             @update:model-value="onUpdate"
             @save-shortcut="doSave"