quill-editor在vue3中的格式

在 Vue 3 中使用 Quill Editor 的步骤如下：

1. 安装 `quill` 和 `vue-quill-editor`：

npm install quill vue-quill-editor

2. 在 Vue 3 的组件中导入和注册 `vue-quill-editor`：

import { defineComponent } from 'vue';
import 'quill/dist/quill.core.css';
import 'quill/dist/quill.snow.css';
import 'quill/dist/quill.bubble.css';
import { quillEditor } from 'vue-quill-editor';

export default defineComponent({
  components: {
    quillEditor,
  },
});

3. 在模板中使用 `quillEditor` 组件：

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

4. 在 Vue 3 的 `setup()` 函数中声明 `content` 和 `editorOption`：

import Quill from 'quill';

import { ref } from 'vue';

export default {
  setup() {
    const content = ref('');
    const editorOption = {
      modules: {
        toolbar: [
          [{ header: [1, 2, false] }],
          ['bold', 'italic', 'underline'],
          ['image', 'code-block'],
        ],
      },
      placeholder: '请输入内容',
      theme: 'snow',
    };
    return {
      content,
      editorOption,
    };
  },
};

以上就是在 Vue 3 中使用 Quill Editor 的基本步骤，需要注意的是，Quill Editor 的样式需要手动引入。