vue2-editor富文本更改图片上传

1.添加两个属性一个是useCustomImageHandler，一个是@image-added="savePicHandle"

<el-form-item label="内容">
  <vue-editor v-model="form.content" useCustomImageHandler
              placeholder="请输入内容" maxlength="1000" autosize type="textarea" @image-added="savePicHandle"
              @image-removed="removedPicHandle"
  />
</el-form-item>

2.方法,找到自己上传图片的方法路径，直接替换

uploadAction(this.url.upload, formData).then(res => {

这里就可以

// 保存图片实现方法
    savePicHandle(file, Editor, cursorLocation, resetUploader) {
      console.log('2222222222222222222222222', file, Editor, cursorLocation)
      // 引入包内自带的formdata
      const formData = new FormData();
      // 将前端传入formdata中数据名为file的数据追加到formdata,与上篇文章的图片上传相同
      formData.append("file", file);
      // 使用我们上篇文章定义好的图片上传接口,将formdata数据传到后台,并接收返回的数据到res
      uploadAction(this.url.upload, formData).then(res => {
        // 找到返回数据中的图片链接
        let url = 'http://localhost:8891' + res.url;
        // 用vue-editor包自带的插入方法:在光标所在位置,插入一张图片,图片的地址是url
        Editor.insertEmbed(cursorLocation, "image", url);
        // 刷新(重置)编辑器
        resetUploader();
      }).catch(err => {
        console.error('保存图片错误: ', err)
      })
    },
    removedPicHandle(image) {
      console.log(image)
    },