1. 概述

我们表单的富文本框,集成富文本时,控件改成了 WANGEDITOR,在编辑器中,上传图片时很常用的需求,本文就介绍下在系统中对图片进行集成。

2. 实现方法

//上传地址
editor.config.uploadImgServer = '/api/api-system/system/core/sysFile/upload';
//最多允许图片数量
editor.config.uploadImgMaxLength = 10;
// 应为上传需要传入token。
editor.config.uploadImgHeaders = {
     Authorization: "Bearer "+ this.token
}
//使用回调函数进行数据插入
editor.config.uploadImgHooks={
            customInsert: function(insertImgFn, result) {
                // result 即服务端返回的接口
                let ary=result.data;
                for(let i=0;i<ary.length;i++){
                    let fileId=ary[i].fileId;
                    let url=`/api/api-system/system/core/sysFile/previewImg?fileId=${fileId}`;
                    insertImgFn(url);
                }
            }
}

加上这段代码后,wangedit 就支持图片上传了,可以直接通过复制粘贴的方式上传图片。

文档更新时间: 2021-11-23 11:51   作者:zyg