toolbar icon自定义

[transtone]

可否将这段代码加入到 edotor.vue 文件中，以实现官方的工具栏图标自定义功能？

   methods: {
      // Init Quill instance
      initialize() {
        if (this.$el) {
          var icons = Quill.import("ui/icons")
          icons["bold"] = '<i class="ql-bold"></i>'
          icons["italic"] = '<i class="ql-italic"></i>'
          icons["underline"] = '<i class="ql-underline"></i>'
          icons["strike"] = '<i class="ql-strike"></i>'
          icons["blockquote"] = '<i class="ql-blockquote"></i>'
          icons["code"] = '<i class="ql-code"></i>'
          icons["code-block"] = '<i class="ql-code-block"></i>'
          icons["header"]["1"] = '<i class="ql-header1"></i>'
          icons["header"]["2"] = '<i class="ql-header2"></i>'
          icons["header"]["2"] = '<i class="ql-header2"></i>'
          icons["header"]["3"] = '<i class="ql-header3"></i>'
          icons["header"]["4"] = '<i class="ql-header4"></i>'
          icons["header"]["5"] = '<i class="ql-header5"></i>'
          icons["list"]["ordered"] = '<i class="ql-list-ordered"></i>'
          icons["list"]["bullet"] = '<i class="ql-list-bullet"></i>'
          icons["indent"]["+1"] = '<i class="ql-indent-increase"></i>'
          icons["indent"]["-1"] = '<i class="ql-indent-decrease"></i>'
          icons["color"] = '<i class="ql-color"></i>'
          icons["background"] = '<i class="ql-background"></i>'
          icons["script"]["sub"] = '<i class="ql-script-sub"></i>'
          icons["script"]["super"] = '<i class="ql-script-super"></i>'
          icons["align"][""] = '<i class="ql-paragraph-left"></i>'
          icons["align"]["right"] = '<i class="ql-paragraph-right"></i>'
          icons["align"]["center"] = '<i class="ql-paragraph-center"></i>'
          icons["align"]["justify"] = '<i class="ql-paragraph-justify"></i>'
          icons["clean"] = '<i class="ql-clean"></i>'
          icons["link"] = '<i class="ql-link"></i>'
          icons["image"] = '<i class="ql-image"></i>'
          // Options

当然最好做成参数，从外边传进来。

#84

[surmon-china]

开放性功能不适合集成至组件，这一类更改建议在入口文件处进行更新。

[transtone]

请问有好的“入口文件处更新”的方法吗，对这块不熟，所以想偷懒，让开发者加新功能，抱歉。

[surmon-china]

如果你想让他在自己的应用里所有的编辑器都工作，那在 use 之前就可以手动改啊：

import Vue from 'vue'
import VueQuillEditor, { Quill } from 'vue-quill-editor'

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

const icons = Quill.import("ui/icons")
icons["bold"] = '<i class="ql-bold"></i>'
icons["italic"] = '<i class="ql-italic"></i>'
icons["underline"] = '<i class="ql-underline"></i>'
icons["strike"] = '<i class="ql-strike"></i>'
icons["blockquote"] = '<i class="ql-blockquote"></i>'
icons["code"] = '<i class="ql-code"></i>'
icons["code-block"] = '<i class="ql-code-block"></i>'
icons["header"]["1"] = '<i class="ql-header1"></i>'
icons["header"]["2"] = '<i class="ql-header2"></i>'
icons["header"]["2"] = '<i class="ql-header2"></i>'
icons["header"]["3"] = '<i class="ql-header3"></i>'
icons["header"]["4"] = '<i class="ql-header4"></i>'
icons["header"]["5"] = '<i class="ql-header5"></i>'
icons["list"]["ordered"] = '<i class="ql-list-ordered"></i>'
icons["list"]["bullet"] = '<i class="ql-list-bullet"></i>'
icons["indent"]["+1"] = '<i class="ql-indent-increase"></i>'
icons["indent"]["-1"] = '<i class="ql-indent-decrease"></i>'
icons["color"] = '<i class="ql-color"></i>'
icons["background"] = '<i class="ql-background"></i>'
icons["script"]["sub"] = '<i class="ql-script-sub"></i>'
icons["script"]["super"] = '<i class="ql-script-super"></i>'
icons["align"][""] = '<i class="ql-paragraph-left"></i>'
icons["align"]["right"] = '<i class="ql-paragraph-right"></i>'
icons["align"]["center"] = '<i class="ql-paragraph-center"></i>'
icons["align"]["justify"] = '<i class="ql-paragraph-justify"></i>'
icons["clean"] = '<i class="ql-clean"></i>'
icons["link"] = '<i class="ql-link"></i>'
icons["image"] = '<i class="ql-image"></i>'

Vue.use(VueQuillEditor, /* { default global options } */)