Vue setup Quill text editer

Full toolbar options from Quilljs

modules: {
        'syntax': true,
        'toolbar': [
          [{ 'font': [] }, { 'size': [] }],
          [ 'bold', 'italic', 'underline', 'strike' ],
          [{ 'color': [] }, { 'background': [] }],
          [{ 'script': 'super' }, { 'script': 'sub' }],
          [{ 'header': '1' }, { 'header': '2' }, 'blockquote', 'code-block' ],
          [{ 'list': 'ordered' }, { 'list': 'bullet'}, { 'indent': '-1' }, { 'indent': '+1' }],
          [ 'direction', { 'align': [] }],
          [ 'link', 'image', 'video', 'formula' ],
          [ 'clean' ]
    ]
 }

How to use in Vue

<QuillEditor  
    theme="snow"  
    :toolbar="[  
       { size: [] },  
       'bold',  
       'italic',  
       'underline',  
       'strike',  
       { list: 'ordered' },  
       { list: 'bullet' },  
       { indent: '-1' },  
       { indent: '+1' },  
       'link',  
       'image',  
       'video',  
    ]"  
/>

Metadata

Status :: #🌱

Note Type :: #📩/📰

Source URL ::VueQuill | Rich Text Editor Component for Vue 3 , Full toolbar options from Quilljs · Issue #295 · KillerCodeMonkey/ngx-quill · GitHub

Author :: Ben

Topics :: {筆記跟什麼主題有關,用[Topic],[Topic] 格式子}

To Me :: #body

Parent Link :: {可以連結到哪個父筆記}

Sibling Link :: {可以連結到哪個相關筆記}

Child Link :: The quill publicly available css 如何讓quill所寫出來的html能正常顯示