vue3中使用vue-quill-editor的教程及简易配置

Vue-Quill-Editor是一个用于Vue.js 2的Quill.js富文本编辑器组件，支持Vue.js 3。下面是Vue 3中使用Vue-Quill-Editor的简易配置教程：

### 安装

使用npm安装：

npm install vue-quill-editor --save

### 引入

在需要使用的组件中引入Vue-Quill-Editor：

import { createApp } from 'vue'
import VueQuillEditor from 'vue-quill-editor'

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

const app = createApp(App)

app.use(VueQuillEditor)

### 使用

在组件中使用Vue-Quill-Editor：

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

<script>
export default {
  data() {
    return {
      content: ''
    }
  }
}
</script>

### 配置

你可以通过传递一个配置对象来配置编辑器。例如：

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

<script>
export default {
  data() {
    return {
      content: '',
      editorOption: {
        placeholder: '请输入内容',
        theme: 'snow'
      }
    }
  }
}
</script>

上面的代码将在编辑器中显示一个占位符，并使用雪花主题。

更多配置选项可以在Quill.js官方文档中找到：[https://quilljs.com/docs/configuration/](https://quilljs.com/docs/configuration/)