vuecli项目下wangEditor副文本编辑器的简单使用

1.npm安装wangEditor

npm install wangeditor

2.引入

import E from 'wangeditor'

3.生成wangeditor文本框

<template>
    <div id="editorElem" style="width:500px;height:350px"></div>
</template>
<script>
    mounted() {
        var editor = new E('#editorElem')
        editor.create();
    },
</script>

4.实现本地图片上传功能

mounted() {
    editor.customConfig.zIndex = 1;
    editor.customConfig.customUploadImg = function (files, insert) {
        var formData = new FormData();
        formData.append("file",files[0]);

        axios.post(文件上传的api路径, formData).then(function (response) {
            insert(接口返回的文件路径);
        }).catch(function (error) {
            console.log(error);
        });
    }
    editor.create();
}