(资料图片)

数据库中有markdown语法的字符串，需要展示为正常的页面，难点在于其中的katex数学公式

使用showdown及其族系插件

npm i showdown

npm i showdown-katex

<script>import showdown from "showdown";import showdownKatex from "showdown-katex";  export default {  data() {    return {      msgInfo: ""  // markdown语法的字符串    }  },  methods: {    transformMsg(msgInfo = "") {      msgInfo = msgInfo.replaceAll("
", "\n");  // 一些处理      let converter = new showdown.Converter({        // 详细配置见：https://github.com/showdownjs/showdown#valid-options        tables: true,  // 支持table语法        strikethrough: true,  // 将~~strikethrough~~ 识别为 strikethrough        underline: true,  // __test__中的下划线不识别为 和         extensions: [          showdownKatex({            // 使用方式见：https://obedm503.github.io/showdown-katex            // 详细配置见：https://katex.org/docs/options.html            throwOnError: false,  // 公式有错时，是否抛出错误            displayMode: false,  // 如果为false，公式以inline方式渲染            delimiters: [              { left: "$$", right: "$$", display: false },              { left: "$", right: "$", display: false },              { left: "~", right: "~", display: false, asciimath: true },            ],          }),        ],      });      return converter.makeHtml(msgInfo);    }  }}</script>

.katex-html {  display: none;}