wangEditor自定义上传图片
2023-08-16 22:42:53 哔哩哔哩

wangEditor官方文档和视频并没有给到前端代码示例,虽然基本上也能判断,但是对新手不是很友好,记录下wangEditor自定义上传图片,粗浅的代码如下,有问题欢迎评论区讨论,我只会简答的,难的问题就期望评论区遇到大佬了。

后端接口

1、返回值RestBean<ImageData>


(资料图片仅供参考)

ImageData保存wangEditor中定义图片的是三个参数

单独创建RestBean<T>是方便我整个项目的统一,可以仅使用上面的ImageData

2、上传接口

url:/upload/image

参数:@RequestParam MultipartFile file

3、下载接口

url:/download/image/{imageName}

前端(主要记录内容)

1、editorConfig配置

直接在customUpload(){    }中自己的上传文件代码。

upload: 自定义的上传方法,看下面的代码

/upload/image: 对应后端接口

file: file: 第一个file对应后端需要接受的参数名file,第二个file就是方法中传进来的图片

message:对应后端RestBean中的message参数,这个保存的就是ImageData。

然后就是给inserFn传入这个参数

2、upload方法

热门推荐