简介

今天跟大家分享的是一款Markdown web编辑器，Vditor，如果你的项目需要提供Markdown编辑能力，那请关注一下这款好用免费的开源编辑器吧。

功能

主要的功能，所见即所得，输入Markdown 标记，就可以实时渲染结果预览。其他功能，可以访问官方网站查询。

快速上手

我们新建一个index.html，输入内容如下

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/index.css" />
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/index.min.js"></script>
<div id="vditor"></div>
<div id="inpost"></div>
<script type="text/javascript">
    new Vditor('vditor', {
        height: 360,
        cache: { enable: false },
        value: '可选模式：sv, ir, wysiwyg',
        input(md) {
            document.getElementById("inpost").innerText = '用户进行了输入，Markdown 内容为：\n' + md
        }
    })
</script>

用浏览器打开index.html应该可以看到效果