# 富文本编辑器ckeditor

npm install @ckeditor/ckeditor5-vue

pnpm add @ckeditor/ckeditor5-vue
1
2
3

@ckeditor/ckeditor5-build-classic 是 CKEditor 官方预构建的 Classic 版本,它已经包含了一些基础插件和配置,适用于大多数富文本编辑场景。

const renderContent = computed(() => {
  const latexRegex = /\$\$(.*?)\$\$/g
  let match
  let replacedHtml = props.htmlStr
  while ((match = latexRegex.exec(props.htmlStr)) !== null) {
    const latexFormula = match[1]
    const katexRendered = katex.renderToString(latexFormula, {
      throwOnError: false
    })
    replacedHtml = replacedHtml.replace(match[0], katexRendered)
  }
  return replacedHtml
})
1
2
3
4
5
6
7
8
9
10
11
12
13

修改成

const renderContent = computed(() => {
  const latexRegex = /\$\$(.*?)\$\$/g;
  return props.htmlStr.replace(latexRegex, (match, latexFormula) => {
    return katex.renderToString(latexFormula, {
      throwOnError: false
    });
  });
});
1
2
3
4
5
6
7
8