1、wangEditor富文本

1）、安装插件

npm i wangeditor --save

2）、引入插件

<script>
    import wangEditor from 'wangeditor'
    export default {
        name: 'Wang',
        data() {
            return {
                wEditor: null,
            }
        },
        mounted() {
            const editor = new wangEditor('#editor')
            editor.create()
            this.wEditor = editor
        },
        methods: {

        }
    }
</script>

3）、定义dom组件

<template>
    <div>
        <div>wangEditor富文本测试</div>
        <div class="editor1907">
            <div id="editor"></div>
        </div>
    </div>
</template>

<style>
    .editor1907 {
        text-align: left;
    }
</style>

4）、文件上传

• 配置文件上传服务地址

const E = window.wangEditor
const editor = new E('#div1')

// 配置 server 接口地址
editor.config.uploadImgServer = '/upload-img'

editor.create()

参考文章

• https://www.jianshu.com/p/ad02e71a4fae
• https://www.cnblogs.com/com3/articles/13246872.html
• https://www.cnblogs.com/com3/articles/13246872.html
• https://www.jianshu.com/p/2dad6f49dfe9