使用ueditor富文本图片上传问题,图片上传后保存有的图片为加载中。。。
因为设置contentChange监听,可以监听到值的变化
但是在上传一个较大的图片时,上传的时间会很长,contentChange监听到的img是一个临时的加载中的动画,
后面上传好替换了URL,但是contentChange没有监听到变化,所以保存的时候为加载中的动画
所以在保存的时候强制获取富文本的内容再保存
富文本组件:
methods: { getUEContent2() { // 获取内容方法并传给调用组件 var content = this.editor.getContent() this.$emit('getContentValue',content) } },
父组件:
// 同一个页面放两个富文本时,id不能写死,需要设置为动态的 // 设置ref,可供保存时父组件调用子组件的方法 <Ueditor ref="gameUeditor1" eleId="id1" name="UE" :defaultMsg="params.content1" @getContentValue="getContentChange" /> <Ueditor ref="gameUeditor2" eleId="id2" name="UE" :defaultMsg="params.content1" @getContentValue="getContentChange1" />
getContentChange(value){ this.params.content1 = value }, getContentChange1(value){ this.params.content2 = value }, save() { // 获取富文本内容(图片上传后未及时更新的原因) this.$refs.gameUeditor1.getUEContent2(); this.$refs.gameUeditor2.getUEContent2(); 。。。。。。 }
另外,上传的地址修改的,可以在ueditor.config中修改
/** * 配置项主体。注意,此处所有涉及到路径的配置别遗漏URL变量。 */ window.UEDITOR_CONFIG = { /* 上传图片配置项 */ ,imageUploadUrl: `/上传地址?Token=${getToken()}` , imageUploadName: 'file' , imageMaxSize: 2048000 /* 上传大小限制,单位B */ , imageAllowFiles: [".png", ".jpg", ".jpeg", ".gif", ".bmp"] /* 上传图片格式显示 */ …… }