index.vue 1010 B

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950
  1. <template>
  2. <quill-editor ref="myTextEditor"
  3. v-model="content"
  4. :config="editorOption"
  5. @focus="onEditorFocus($event)"
  6. @blur="onEditorBlur($event)"
  7. @change="onEditorChange($event)"
  8. >
  9. </quill-editor>
  10. </template>
  11. <script>
  12. import {quillEditor} from 'vue-quill-editor'
  13. export default {
  14. components: {
  15. quillEditor
  16. },
  17. props: [],
  18. name: 'QuillEdit',
  19. data() {
  20. return {
  21. content: '<h2>I am Example</h2>',
  22. editorOption: {
  23. theme: 'snow'
  24. }
  25. }
  26. },
  27. mounted() {
  28. },
  29. methods: {
  30. // 准备富文本编辑器
  31. onEditorReady(editor) {
  32. },
  33. // 富文本编辑器 失去焦点事件
  34. onEditorBlur(editor) {
  35. },
  36. // 富文本编辑器 获得焦点事件
  37. onEditorFocus(editor) {
  38. },
  39. // 富文本编辑器 内容改变事件
  40. onEditorChange(editor) {
  41. },
  42. }
  43. }
  44. </script>
  45. <style scoped>
  46. </style>