vue-quill-editor如何保留class属性

Vue Quill Editor是一个富文本编辑器组件，它基于Quill库。如果你想要在将内容从编辑器导出到HTML时保留`class`属性，可以稍微调整一下默认的行为。Quill本身并不直接提供这个功能，但它允许自定义HTML模板生成。

首先，你需要创建一个自定义的`QuillEditor`组件，并覆盖`getBlotTag()`方法，该方法用于转换编辑器内的节点为HTML标签。例如：

<template>
  <div ref="quillEditor" :html="editorHtml"></div>
</template>

<script>
import { QuillEditor } from 'vue-quill-editor'

export default {
  extends: QuillEditor,
  props: {
    content: String, // 用户输入的内容
  },
  computed: {
    editorHtml() {
      const quill = this.$refs.quillEditor.quill

      return this.content.map((block) => {
        let tag = block.blot.tagName.toLowerCase()
        if (block.has('attribs') && block.attribs.class) {
          tag += ` class="${block.attribs.class.join(' ')}"`
        }
        return `<${tag} data-blob-id="${block.id}" ${block.attrs}>${block.text}</${tag}>`
      }).join('\n')
    },
  },
}
</script>

在这个例子中，我们检查每个块元素（Block）是否包含`class`属性，如果有，则将其添加到HTML标签上。注意这只是一个基本示例，实际应用中你可能需要处理更多复杂的样式和属性。