soccerloway / quill-better-table

Module for better table in Quill, more useful features are supported.
MIT License
313 stars 120 forks source link

Support for Vue? #31

Closed gomezmark closed 4 years ago

gomezmark commented 4 years ago

Will you support on Vue?

soccerloway commented 4 years ago

There is a open-source repo called vue-quill-editor for using quill editor in Vue, but it depends on quill 1.3.x. You may need to fork vue-quill-editor and update the quill version to 2.0.0-dev.x if you want to use quill-better-table in vue-quill-editor. Or you can make a custom component by Vue and Quill 2.0.0-dev.x, remember to regist quill-better-table before initializing editor, it's not too difficult.

gomezmark commented 4 years ago

Hi @soccerloway

Thank you for your advice. I used v. 2.0.0-dev.3

In my vue component

...
if (process.client || process.browser) {
  Quill = require('quill')
  QuillBetterTable = require('quill-better-table')
  Quill.register({
    'modules/better-table': QuillBetterTable
  }, true)

...

mouted () {
this.editorInstance = new Quill(this.$refs.testquill, {
      theme: 'snow',
      modules: {
        toolbar: this.$refs['editor-toolbar'],
        table: false,  // disable table module
        'better-table': {
          operationMenu: {
            items: {
              unmergeCells: {
                text: 'Another unmerge cells name'
              }
            }
          }
        },
        keyboard: {
          bindings: QuillBetterTable.keyboardBindings
        }
      },
      placeholder: 'Compose an epic...',
    })
}

It worked. :)