渲染填空题类型cloze

src/utils/renderJSON.ts

@@ -3,6 +3,7 @@
 import { RichTextBlockJSON, RichTextJSON, RichTextSectionJSON } from "@/types";
 
 let _container = document.createElement("div");
+let clozeIndex = 0;
 /**
  * 将富文本 JSON 渲染到指定的元素中
  *
@@ -11,6 +12,7 @@ let _container = document.createElement("div");
  */
 export function renderRichText(body: RichTextJSON, container?: HTMLDivElement) {
   _container = container || document.createElement("div");
+  clozeIndex = 0;
   let sections = body?.sections || [];
   let nodes = [] as Array<Node>;
   sections.forEach((section) => {
@@ -117,6 +119,9 @@ function renderBlock(block: RichTextBlockJSON, inline: boolean) {
     node.className = "audio";
     node.src = block.value;
     node.controls = true;
+  } else if (block.type === "cloze") {
+    node = document.createElement("span");
+    node.innerHTML = `___${++clozeIndex}___`;
   }
 
   return node as Node;