vue-html5-editor 使用

安装      npm install vue-html5-editor

在main.js中 

import VueHtml5Editor from 'vue-html5-editor'
import '../src/assets/css/font-awesome.min.css'  //引入样式  需要单独下载
import oedit from './components/initHTMLEditor.js' //引入配置文件

Vue.use(VueHtml5Editor, oedit)  

在 ***.vue 中

<vue-html5-editor :content="content" @change="updateData"  :height="500"  :z-index="1000" :auto-height="true" :show-module-name="false"></vue-html5-editor>

methods: { 
        updateData(e) {  // 把所有传入的图片都统一成宽度100%； 防止用户上传图片过大
            this.content = e;
            console.info(e);
            let c1 = e.replace(/<img width="100%"/g, "<img");
            let c2 = c1.replace(/<img/g, '<img width="100%"');
            this.content = c2;
        }
    }

虽然可以做图文混排，不过在手机上依旧是操作困难。

个人建议：还是尽量在电脑端做上传，手机浏览。