wangEditor上传图片成功不显示问题、wangEditor使用

最近使用富文本编译器在测试的时候发现一个问题

正常情况下我们会点击富文本输入内容，最后点击图片上传，但是用户存在直接点击图片上传的操作，这种情况在移动端的设备下比较常见。但是在form表单里，输入其他文本框后，此时焦点在其他文本框中，直接点击富文本的上传图片按钮，出现了问题。

未获取焦点的时候直接点击图片上传会上传成功但是图片不显示。

wangEditor官方文档传送 wangEditor传送入口

插入图片配置代码

    this.editor.config.customUploadImg = function(resultFiles, insertImgFn) {
        // resultFiles 是 input 中选中的文件列表
        // insertImgFn 是获取图片 url 后，插入到编辑器的方法
        resultFiles.forEach(item => {
          
          that
            .axios({
              url: that.baseUpload.host,
              method: 'POST',
              data: params
            })
            .then(res => {
              let data = res.data;
              // data.url = res.data.resourceUrl;
              data.url = res.data.resourceUrl;
              // 上传图片，返回结果，将图片插入到编辑器中
              insertImgFn(data.url);
            })
            .catch(err => {});
        });
      };

如图，大家的配置代码可能不一致，但是没关系，在图片上传插入的配置中加入一行代码就可以了。这也是花了很久时间从原型链上找到的方法initSelection()， 作用是初始化选定区域。

在文件上传的时候初始化一下选区就ok了。