1.定义一个div

content 是你向展示的 markdown 格式数据

<div id="previewMarkdown">
    <textarea>{{ content }}</textarea>
</div>

2.导入js

这个都是 lib 目录下的 js 文件，因为 markdown 组件依赖这些 js 文件

<script src="{% static 'plugin/editor-md/editormd.min.js' %}"></script>
<script src="{% static 'plugin/editor-md/lib/flowchart.min.js' %}"></script>
<script src="{% static 'plugin/editor-md/lib/jquery.flowchart.min.js' %}"></script>
<script src="{% static 'plugin/editor-md/lib/marked.min.js' %}"></script>
<script src="{% static 'plugin/editor-md/lib/prettify.min.js' %}"></script>
<script src="{% static 'plugin/editor-md/lib/raphael.min.js' %}"></script>
<script src="{% static 'plugin/editor-md/lib/sequence-diagram.min.js' %}"></script>
<script src="{% static 'plugin/editor-md/lib/underscore.min.js' %}"></script>

3.写个函数

htmlDecode 属性是过滤掉输入内容的一些标签，让其以字符串格式显示。

function initPreviewMd() {
    editormd.markdownToHTML("previewMarkdown", {
        htmlDecode: 'style, script, iframe',
    });
}

展示效果：