vue使用mavon-editor将本地图片base64格式上传后端并回显

要实现将本地图片以base64格式上传到后端，可以使用以下步骤：

1. 在Vue项目中安装mavon-editor插件，可以使用npm进行安装：`npm install mavon-editor --save`

2. 在需要使用编辑器的Vue组件中引入mavon-editor并注册组件：

   <template>
     <mavon-editor v-model="content" @imgAdd="handleImgAdd"></mavon-editor>
   </template>
   
   <script>
   import 'mavon-editor/dist/css/index.css'
   import MavonEditor from 'mavon-editor'
   
   export default {
     components: {
       MavonEditor
     },
     data() {
       return {
         content: ''
       }
     },
     methods: {
       handleImgAdd(data) {
         // 处理图片上传
       }
     }
   }
   </script>

3. 在handleImgAdd方法中，可以使用FormData对象将base64格式的图片数据上传到后端，代码如下：

    handleImgAdd(data) {
      const file = data.file
      const reader = new FileReader()
      const vm = this
      reader.readAsDataURL(file)
      reader.onload = function() {
        const formData = new FormData()
        formData.append('image', this.result)
        axios.post('/upload-image', formData).then(response => {
          vm.content += '<img src="' + response.data.url + '">'
        })
      }
    }

上述代码中，我们使用FileReader对象将文件读取为base64格式，然后创建FormData对象，将base64数据作为参数添加到formData中。最后，使用axios库的post方法将formData发送到后端。当上传成功后，我们将回调函数中的response.data.url作为图片的src属性，插入到编辑器中。

4. 在后端接收base64格式的图片数据，并将其转换为文件保存到服务器，最后返回图片的URL地址。这一部分需要根据后端框架和语言进行实现，这里不做过多介绍。

以上就是使用mavon-editor将本地图片以base64格式上传到后端并回显的步骤。