Vue配置Markdown文本编辑

安装 mavon-editor组件

 cnpm install mavon-editor --save

在Vue的页面中使用mavon-editor

<template>
    <div>
        <mavon-editor v-model="content" ref="md" @change="change"  style="min-height: 600px" />
    </div>
</template>

完整js码

<script>
  import axios from 'axios'
  import { mavonEditor } from 'mavon-editor'
  // 引入编辑器样式 
  import 'mavon-editor/dist/css/index.css'
  export default {
    data() {
        return {
            content:'', // 输入的markdown
            html:'',    // 转成的html  
        }
    },    
     methods: {
        change(value, render) {
            //实时获取转成html的数据
            this.html = render
            console.log(this.html)
        },
 
  
  }
</script>