Vue中使用quill-editor富文本编辑器之修改工具栏

如果你想修改 `quill-editor` 富文本编辑器的工具栏，可以使用 `toolbar` 属性来自定义它。

以下是一个自定义工具栏的示例：

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

data() {
  return {
    content: '',
    editorOption: {
      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'] // 链接，图片，视频
      ]
    }
  }
}

在这个示例中，我们使用 `toolbar` 属性来定义工具栏的按钮和布局。你可以根据需要添加，删除或修改工具栏中的按钮。

更多 `quill-editor` 的使用细节，可以参考官方文档：https://github.com/surmon-china/vue-quill-editor。