wangEditor 自定义上传图片-526互联

//需要项目后台提供上传接口uploadFile  

下载接口FILE_URL：
Object.defineProperties(Vue.prototype, {
  FILE_URL: {
    value: function (fileId) {
      if (!fileId) {
        return
      }
      return (
        process.env.VUE_APP_REMOTE_URL +
        'mi' +
        '/api/v1/file/download' +
        toQueryString({ token: getToken(), fileId })
      )
    },
  },
})

---------------------------------------------------------------------------------------
this.editor = new E('#editor')
const this_ = this
// 自定义上传图片
this.editor.config.customUploadImg = async function (
  resultFiles,
  insertImgFn,
) {
  // resultFiles 是 input 中选中的文件列表
  // insertImgFn 是获取图片 url 后，插入到编辑器的方法
  const promises = resultFiles.map(file => {
    const formData = new FormData()
    formData.append('file', file)
    return uploadFile(formData)
  })
  const imgIds = await Promise.all(promises)
  const urls = imgIds.map(v => this_.FILE_URL(v))
  urls.forEach(v => {
    this_.editor.cmd.do(
      'insertHtml',
      '<img src="' + v + '" style="width:100%"/>',
    )
  })
}
this.editor.create()
this.editor.txt.html('') //设置内容