nuxt vue-quill-editor自定义上传图片

要在nuxt项目中使用vue-quill-editor自定义上传图片，你需要进行以下几个步骤：

1. 安装依赖

npm install vue-quill-editor --save
npm install quill-image-drop-module --save

2. 在nuxt.config.js配置文件中添加如下代码

build: {
  transpile: ['vue-quill-editor'],
},

3. 在你的.vue组件中添加如下代码

<template>
  <div>
    <quill-editor
      v-model="content"
      :options="editorOption"
      @image-added="handleImageAdded"
    />
  </div>
</template>

<script>
import { quillEditor } from 'vue-quill-editor'
import 'quill/dist/quill.snow.css'
import 'quill/dist/quill.bubble.css'
import ImageDrop from 'quill-image-drop-module'

export default {
  components: {
    quillEditor
  },
  data() {
    return {
      content: '',
      editorOption: {
        placeholder: '请输入内容',
        modules: {
          imageDrop: true,
          toolbar: [
            ['bold', 'italic', 'underline', 'strike'],
            ['blockquote', 'code-block'],
            [{ header: 1 }, { header: 2 }],
            [{ list: 'ordered' }, { list: 'bullet' }],
            [{ script: 'sub' }, { script: 'super' }],
            [{ indent: '-1' }, { indent: '+1' }],
            [{ direction: 'rtl' }],
            [{ size: ['small', false, 'large', 'huge'] }],
            [{ header: [1, 2, 3, 4, 5, 6, false] }],
            [{ color: [] }, { background: [] }],
            [{ font: [] }],
            [{ align: [] }],
            ['clean'],
            ['link', 'image', 'video']
          ]
        }
      }
    }
  },
  methods: {
    handleImageAdded(file) {
      // 此处可将文件上传至服务器，并返回图片地址，将返回的地址插入到编辑器中
      const reader = new FileReader()
      reader.onload = () => {
        const img = reader.result
        this.$nextTick(() => {
          const cursorPosition = this.$refs.myQuillEditor.quill.getSelection().index
          this.$refs.myQuillEditor.quill.insertEmbed(cursorPosition, 'image', img)
        })
      }
      reader.readAsDataURL(file)
    }
  }
}
</script>

在以上代码中，我们首先引入了vue-quill-editor和quill-image-drop-module模块。然后在data中定义了一个content变量，用于存储编辑器中的内容。editorOption变量用于配置编辑器的选项，其中modules选项中启用了imageDrop模块和toolbar工具栏。

在methods中定义了一个handleImageAdded方法，用于处理图片上传。此处我们将文件上传至服务器，并返回图片地址，然后将返回的地址插入到编辑器中。

最后在组件中添加了一个quill-editor组件，并将options和image-added事件绑定到对应的变量和方法上。

希望以上内容能够对你有所帮助。