A Vue component used for rich text editor with Quill JS. This project created and used for iSPA CMS, so if you used this package, please noted that we maynot check your issue or request.
npm i @ispa.io/vquill // npm
import Vue from 'vue';
import vQuill from '@ispa.io/vquill'
Vue.component('vquill', vQuill);
<vquill
v-model="text"
:toolbar="toolbar"
placeholder="Place a text"
></vquill>
This below is the default of toolbar, you can edit it by yourself for the best tool you need.
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']
]
Placeholder text
- Type:
String
- Default:
Type your text content...
This is theme from Quill. Both of themes are included.
- Type:
String
- Default:
snow
|bubble
Height of editor container. Only allow number
type.
- Type:
Number
- Default:
200
Maintained under the Semantic Versioning guidelines.
- quill-image-extend-module
- quill-image-resize-module
- quill-image-drop-module
- quilljs-table
- more modules...
If you like this project and want to contribute us, then you can send us a cup of coffee by this ways below:
PAYPAL.ME | MOMO App (Vietnam) |
---|---|