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能正常顯示