image.png
由于我們是使用Markdown編寫的，但是展示的時候發(fā)現(xiàn)，格式不太對，本文就是對這個問題進(jìn)行解決的
關(guān)注我，主頁更多干貨
解決預(yù)覽頁面使用Markdown顯示
image.png
1.找到目標(biāo)位置，使用div和textare包裹
2.引入css\js：
3.進(jìn)行初始化即可
代碼：
css:
<link rel="stylesheet" href="{% static 'plugin/editor-md/css/editormd.preview.min.css' %}">
js:
<script src="{% static 'plugin/editor-md/editormd.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/underscore.min.js' %}"></script>
<script src="{% static 'plugin/editor-md/lib/sequence-diagram.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>
js配置：
$(function () {
initCatalog();
initPreviewMarkDown();
});
function initPreviewMarkDown() {
editormd.markdownToHTML("previewMarkdown",{
htmlDecode:"style,script,iframe",//過濾這些內(nèi)容
});
}
修改后
image.png
這些只是簡單的使用，更多參數(shù)請看官網(wǎng)哦！
總結(jié):目前最基本的使用，我們就可以使用了它的編輯和預(yù)覽了。下一步我們就還要考慮一下他的圖片本地上傳的問題！
