Vue projects use Markdown to display text

Download mavon – editor

npm i mavon-editor --save
Copy the code

How to introduce

main.js

import Vue from 'vue'
import App from './App'
import mavonEditor from 'mavon-editor'
Vue.use(mavonEditor)
new Vue({
    el: '#app'.components: { App },
    template: '<App/>'
});
Copy the code

index.vue

<template> <mavon-editor :toolbars="toolbars" v-model="value" :subfield="prop.subfield" :defaultOpen="prop.defaultOpen" :toolbarsFlag="prop.toolbarsFlag" :editable="prop.editable" :scrollStyle="prop.scrollStyle" :boxShadow="prop.boxShadow" ref=md /> </template> <script> ... data() { return { value: "# test markdown" }; }, computed: {prop() {let data = {subfield: false,// Single-column mode defaultOpen: 'Preview ',// Edit: displays the edit area by default, preview: displays the preview area by default editable: false, toolbarsFlag: false, scrollStyle: false, boxShadow: False // frame} return data}} </script>Copy the code

A recruit dead, after finishing work, remember (°▽°) Blue ✿