[VUE插件系列] - vue-bl-markdown-editor编辑器组件组件

我在oschina看到了vue-bl-markdown-editor的首页推荐

内心在想，既然进入了oschina的首页推荐，可能在往后的工做中会用的到的插件，在这里记录一下。

其中还有涉及到一些工具栏的用法，能够详细查看gitee平台的教程，gitee地址见底部查看。

安装插件

npm install vue-bl-markdown-editor复制代码

引入vue-bl-markdown-editor库

main.json

import MarkDownEditor from 'vue-bl-markdown-editor'
import 'vue-bl-markdown-editor/dist/css/main.css'复制代码

index.html

<!--本组件使用font-awesome字体图标库，请于index.html提早引入--> <link href="//cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"> <!--代码块样式，更多查看 https://highlightjs.org --> <link href="//cdn.bootcss.com/highlight.js/9.14.1/styles/atom-one-dark.min.css" rel="stylesheet"> <!--编辑器主题颜色--> <link href="//cdn.bootcss.com/github-markdown-css/3.0.1/github-markdown.min.css" rel="stylesheet">复制代码

组件中

<template>  <div class="el-markdown">    <h1>vue-bl-markdown-editor</h1>    <mark-down-editor v-model="elvalue"></mark-down-editor>  </div></template><script>export default {  name: 'el-markdown',  data () {    return {      elvalue: '这是第一个markdown例子'    }  }}</script>复制代码

vue-bl-markdown-editor是一个基于markdown-it 高度可扩展的vue编辑器组件，支持扩展markdown-it插件，工具栏，样式，内置经常使用工具栏（图片粘贴上传，拖拽上传，录音上传播放等）

gitee： gitee.com/bl_it/vue-b…