mavon-editor局部引入原创

editor.vue

<template>
    <div id="editor">
        <mavon-editor style="height: 100%"></mavon-editor>
    </div>
</template>
<script>
// Local Registration
import { mavonEditor } from 'mavon-editor'
import 'mavon-editor/dist/css/index.css'
export default {
    name: 'editor',
    components: {
        mavonEditor
        // or 'mavon-editor': mavonEditor
    }
}
</script>
<style>
#editor {
    margin: auto;
    width: 80%;
    height: 580px;
}
</style>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

main.js

import Vue from 'vue';
  var editor = require('./editor.vue');
  new Vue({
    el: '#main',
    render: h => h(editor)
});

1
2
3
4
5
6
7
8
9

将文件名与文件路径插入当前光标位置，这是mavon-editor 内置的方法

const $vm = this.$refs.md
    $vm.insertText($vm.getTextareaDom(),
      {
        prefix: `[${file.name}](${res.data.path})`,
        subfix: '',
        str: ''
      })

1
2
3
4
5
6
7

#前端

上次更新: 2024/01/14 16:27:31

← 文件上传 vuex使用→