富文本编辑器vue-quill-editor

使用方式

安装

cnpm intall vue-quill-editor --save

在插件位置引入

全局引入(在多个位置使用)

富文本编辑器vue-quill-editor
或者在main.js中引入

import VueQuillEditor from 'vue-quill-editor'

// require styles
import 'quill/dist/quill.core.css'
import 'quill/dist/quill.snow.css'
import 'quill/dist/quill.bubble.css'

Vue.use(VueQuillEditor)

局部引入

在调用的页面中声明

<script>
import 'quill/dist/quill.core.css'
import 'quill/dist/quill.snow.css'
import 'quill/dist/quill.bubble.css'

import { quillEditor } from 'vue-quill-editor'

export default {
  components: {
    quillEditor
  }
}
</script>

使用方式

复制SPA部分进行修改

  <quill-editor v-model="content"
                ref="myQuillEditor"
                :options="editorOption"
                @blur="onEditorBlur($event)"
                @focus="onEditorFocus($event)"
                @ready="onEditorReady($event)">
  </quill-editor>

富文本编辑器vue-quill-editor

参考链接

https://www.npmjs.com/package/vue-quill-editor

上一篇:vue富文本编辑器


下一篇:Vue3使用富文本编辑器QuillEditor