src/components/markdown/MarkdownRender.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, onMounted, onBeforeUpdate } from "vue";
+import { ref, onMounted, onBeforeUpdate, watch } from "vue";
 import { marked } from "marked";
 import { useTocStore } from "../../stores/toc";
 
@@ -94,6 +94,10 @@ function render() {
   }
 }
 
+function forceRender(markdown: string) {
+  htmlContent.value = marked.parse(markdown);
+}
+
 onMounted(() => {
   render();
 });
@@ -101,6 +105,13 @@ onMounted(() => {
 onBeforeUpdate(() => {
   render();
 });
+
+watch(
+  () => props.markdown,
+  (newMd) => {
+    forceRender(newMd);
+  }
+);
 </script>
 
 <template>