\r\n\r\n## Homepage\r\n[vue3-quill github-page](https://flyween.github.io/vue3-quill)\r\n\r\n## Usage\r\n\r\n```javascript\r\nnpm i vue3-quill\r\n```\r\n### Global Registration:\r\n```javascript\r\n// global\r\nimport { quillEditor } from 'vue3-quill'\r\napp.use(quillEditor)\r\n\r\n```\r\n### or Local Registration:\r\n```javascript\r\n// single file\r\nimport { quillEditor } from 'vue3-quill'\r\n\r\nexport default {\r\n components: {\r\n quillEditor\r\n }\r\n}\r\n\r\n```\r\n### Module registration example: \r\n```javascript\r\n// global\r\nimport { quillEditor, Quill } from 'vue3-quill'\r\n\r\n// Attention:\r\n// customQuillModule means 'custom module name of Quill',\r\n// not a package's name called 'customQuillModule'.\r\n// Such as:\r\n// import ImageUploader from \"quill.imageUploader.js\";\r\n// Quill.register(\"modules/imageUploader\", ImageUploader);\r\n\r\nimport customQuillModule from 'customQuillModule'\r\nQuill.register('modules/customQuillModule', customQuillModule)\r\napp.use(quillEditor)\r\n\r\n```\r\n### or in a single component\r\n```javascript\r\nimport { quillEditor, Quill } from 'vue3-quill'\r\n// Attention:\r\n// customQuillModule means 'custom module name of Quill',\r\n// not a package's name called 'customQuillModule'.\r\n// Such as:\r\n// import ImageUploader from \"quill.imageUploader.js\";\r\n// Quill.register(\"modules/imageUploader\", ImageUploader);\r\nimport customQuillModule from 'customQuillModule'\r\nQuill.register('modules/customQuillModule', customQuillModule)\r\n\r\nexport default {\r\n components: {\r\n quillEditor\r\n }\r\n}\r\n\r\n```\r\n### In .vue\r\n```vue\r\n\r\n \r\n\r\n\r\n\r\n```\r\n\r\n# Options \r\n## Form Input Bindings: v-model\r\nThe v-model directive can be used to create a two-way data binding. For example: \r\n```vue\r\n\r\n```\r\n## Event binding\r\n```vue\r\n\r\n```\r\nThe following events are available:\r\n- blur\r\n- focus\r\n- ready\r\n- change\r\n\r\n## Options prop\r\n- **options** \r\n Apply the default options by not passing this prop. \r\n The options passed in will override the default preset options. \r\n For example: \r\n ```js\r\n modules: {\r\n toolbar: []\r\n }\r\n ```\r\n this option will generate an empty toolbar. \r\n Check the offical doc [Quill Documentation](https://quilljs.com/docs/configuration/) for all options.\r\n- **disabled** \r\n **Default:** `false` \r\n Set `true` to disabled the editor.\r\n As the value of `readOnly` when initialized.\r\n Value changing will call API [Quill Documentation](https://quilljs.com/docs/api/#enable) of quill after initialization.\r\n \r\n\r\n# Default Quill options\r\n```javascript\r\nmodules: {\r\n toolbar: [\r\n ['bold', 'italic', 'underline', 'strike'],\r\n ['blockquote', 'code-block'],\r\n [{ header: 1 }, { header: 2 }],\r\n [{ list: 'ordered' }, { list: 'bullet' }],\r\n [{ script: 'sub' }, { script: 'super' }],\r\n [{ indent: '-1' }, { indent: '+1' }],\r\n [{ direction: 'rtl' }],\r\n [{ size: ['small', false, 'large', 'huge'] }],\r\n [{ header: [1, 2, 3, 4, 5, 6, false] }],\r\n [{ color: [] }, { background: [] }],\r\n [{ font: [] }],\r\n [{ align: [] }],\r\n ['clean'],\r\n ['link', 'image', 'video']\r\n ]\r\n}\r\n```\r\n\r\n# Packages\r\nBorrowing from: [vue-quill-editor](https://github.com/surmon-china/vue-quill-editor) Inspired by this one. \r\n\r\n[Quill ImageHandler Module](https://www.npmjs.com/package/quill-image-uploader) \r\n...\r\n\r\n# Development\r\n```shell\r\n# root dir\r\nyarn serve\r\n```\r\n\r\n# Welcome PR \r\nThanks to the open source. :heart: \r\n","readmeFilename":"README.md","homepage":"https://flyween.github.io/vue3-quill","repository":{"type":"git","url":"git+https://github.com/flyween/vue3-quill.git"},"bugs":{"url":"https://github.com/flyween/vue3-quill/issues"},"license":"MIT"}
![\"Version\"](\"https://img.shields.io/npm/v/vue3-quill?style=flat-square\")
\r\n ![](\"https://hits.seeyoufarm.com/api/count/incr/badge.svg?url=https%3A%2F%2Fgithub.com%2Fflyween%2Fvue3-quill&count_bg=%2379C83D&title_bg=%23555555&icon=&icon_color=%23E7E7E7&title=hits&edge_flat=false\"/){kind=icon}
\r\n ![\"Downloads\"](\"https://img.shields.io/npm/dm/vue3-quill.svg?sanitize=true\")
\r\n ![\"License\"](\"https://img.shields.io/npm/l/vue3-quill.svg?sanitize=true\")
\r\n