nuxt vue-quill-editor element上传图片

要在nuxt中使用vue-quill-editor和element上传图片，您需要执行以下步骤：

1. 安装依赖：

npm install vue-quill-editor element-ui

2. 在nuxt.config.js中配置插件：

plugins: [
  { src: '@/plugins/vue-quill-editor', ssr: false },
  { src: '@/plugins/element-ui', ssr: true }
]

3. 在plugins文件夹中创建vue-quill-editor.js文件：

import Vue from 'vue'
import VueQuillEditor from 'vue-quill-editor'

// import styles
import 'quill/dist/quill.core.css'
import 'quill/dist/quill.snow.css'
import 'quill/dist/quill.bubble.css'

Vue.use(VueQuillEditor)

4. 在plugins文件夹中创建element-ui.js文件：

import Vue from 'vue'
import Element from 'element-ui'

Vue.use(Element)

5. 在您的组件中使用vue-quill-editor：

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

<script>
export default {
  data() {
    return {
      content: '',
      editorOption: {
        // ...
        // 其他quill-editor选项
        // ...
        imageUpload: {
          url: 'http://localhost:3000/upload',
          method: 'POST',
          name: 'image',
          headers: {
            Authorization: `Bearer ${this.$auth.getToken('local')}`
          },
          withCredentials: true,
          callbackOK: (res) => {
            this.$refs.editor.quill.insertEmbed(this.quill.getSelection().index, 'image', res.url)
          }
        }
      }
    }
  }
}
</script>

6. 在您的组件中使用element-ui上传文件：

<template>
  <div>
    <el-upload
      class="avatar-uploader"
      action="http://localhost:3000/upload"
      :headers="{ Authorization: `Bearer ${this.$auth.getToken('local')}` }"
      :show-file-list="false"
      :on-success="handleAvatarSuccess"
      :before-upload="beforeAvatarUpload">
      <img v-if="imageUrl" :src="imageUrl" class="avatar">
      <i v-else class="el-icon-plus avatar-uploader-icon"></i>
    </el-upload>
  </div>
</template>

<script>
export default {
  data() {
    return {
      imageUrl: ''
    }
  },
  methods: {
    handleAvatarSuccess(res, file) {
      this.imageUrl = res.url
    },
    beforeAvatarUpload(file) {
      // 验证文件类型和大小等
    }
  }
}
</script>