// Attach the addresswww.npmjs.com/package/mav…

NPM install mavon-editor --save mai.js import Vue from 'Vue' import mavonEditor from 'mavon - editor' import 'mavon - editor/dist/CSS/index. The CSS' Vue. Use (mavonEditor) / / let the Vue using mavonEditor / / Vue To display our markdown editor <template> <div> <mavon-editor v-model="value"/> </div> </template> <script> import 'mavon-editor/dist/css/index.css' export default { name: 'mavoEditor', data() { return { value: '' } }, methods: { } } </script>Copy the code

Edit the incoming local image

@imgadd <mavon-editor ref="md" @imgadd ="imgAdd" v-model="value" /> ImgAdd (pos,file){var formData = new formData () formdata.append ('newImg', file); Method: 'post', data: formData, headers: {' content-type ': 'multipart/form-data' } }).then((res) => { if(res.data.errno==2000){ let json = res.data.data.picUrl; This.$refs.md1.$imglst2Url([[pos,json]]); Pass in markdown}})} // The above code can be optimized according to the projectCopy the code

show

<mavon-editor V-model ="value" :subfield="false" :boxShadow="false" DefaultOpen ="preview" :toolbarsFlag="false" /> This way we are done showing the configuration details and the official address for the configurationCopy the code