Javascript 纬管图像调整vue中的对齐错误

当我使用“纬管图像调整vue”时，图像中的对齐有问题，对齐到中心或右侧，但当我去查看结果时，它是左对齐的

并非所有情况下都会发生这种情况，但我无法确定在哪些情况下它会失败

我唯一注意到的是，当它工作时，img属性有“display:block”和“margin:auto”

这是我的代码：

import { VueEditor } from "vue2-editor";
import { ImageDrop } from "quill-image-drop-module";
import ImageResize from "quill-image-resize-vue";

export default {
  name: "format-document-form",
  components: {
    VueEditor,
  },
  data: function () {
      editorData: "<p>Desarrollo de la agenda...</p>",
      customModulesForEditor: [
        { alias: "imageDrop", module: ImageDrop },
        { alias: "imageResize", module: ImageResize },
      ],
      editorSettings: {
        modules: {
          imageDrop: true,
          imageResize: {},
        },
      },
   }
}

从“vue2编辑器”导入{Vueditor}；
从“纬管图像放置模块”导入{ImageDrop}；
从“纬管图像调整vue”导入图像调整大小；
导出默认值{
名称：“格式文件表格”，
组成部分：{
VueEditor，
},
数据：函数（）{
编辑资料：“议程……
”，
customModulesForEditor：[
{别名：“imageDrop”，模块：imageDrop}，
{别名：“imageResize”，模块：imageResize}，
],
编辑设置：{
模块：{
imageDrop：是的，
imageResize:{}，
},
},
}
}

HTML：

<vue-editor
  v-model="editorData"
  :customModules="customModulesForEditor"
  :editorOptions="editorSettings"
></vue-editor>

当我创建时，它看起来是这样的：

但是当我解释HTML时，它看起来是这样的：