vue-markdown-editor-orh

vue-markdown-editor

具备 markdown 编辑器和 markdown 文本解析显示功能

常规

<link href="path/vue-markdown-editor/css/index.css" rel="stylesheet">

<script src="https://cdn.bootcss.com/vue/2.6.10/vue.min.js"></script>
<script src="path/vue-markdown-editor/js/index.js"></script>

NPM

1. 安装

yarn add vue-markdown-editor-orh --dev

2. 引入 js

import vueMarkdownEditor from 'vue-markdown-editor-orh';

Vue.use(vueMarkdownEditor);

3. 引入样式

@import "~vue-markdown-editor-orh/dist/css/index";

使用编辑器

<vue-markdown-editor v-model="content"></vue-markdown-editor>

• 使用 simplemde-markdown-editor

• props

属性	说明	类型	默认值
value	markdown 文本，可以使用 v-model 双向绑定数据	String	空
options	可传入 simplemde-markdown-editor 的所有配置	Object	{}
name	表单 textarea 的 name 属性	String	-

使用解析器

<vue-marked :value="content"></vue-marked>

• 使用 marked

• 使用 highlight.js 的 atom-one-dark 主题

• props

属性	说明	类型	默认值
value	markdown 文本	String	空