main.ts
1 2 3 4 5 6 7 8 9 10 11 |
import { createApp } from 'vue'; import './style.css'; import App from './App.vue'; import { QuillEditor } from '@vueup/vue-quill' import '@vueup/vue-quill/dist/vue-quill.snow.css'; const app = createApp(App); app.component('QuillEditor', QuillEditor) // Mount the app app.mount('#app'); |
App.vue
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
<template> <QuillEditor theme="snow" :toolbar="[ [{ header: [1, 2, 3, 4, 5, 6, false] }], // Header levels [{ font: [] }], // Font family [{ size: ['small', false, 'large', 'huge'] }], // Font size ['bold', 'italic', 'underline', 'strike'], // Formatting buttons [{ color: [] }, { background: [] }], // Text and background colors [{ script: 'sub' }, { script: 'super' }], // Subscript and superscript [{ list: 'ordered' }, { list: 'bullet' }], // Lists [{ indent: '-1' }, { indent: '+1' }], // Indentation [{ align: [] }], // Alignment options ['blockquote', 'code-block'], // Blockquote and code block ['link', 'image', 'video'], // Media options ['clean'] // Clear formatting ]" /> </template> |