1、安裝??

npm install vue-quill-editor --save

2、使用

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

　　

3、組件中

<quill-editor v-model="content"ref="myQuillEditor"class="editer":options="editorOption"@ready="onEditorReady($event)"></quill-editor>

　　

data(){return {content: '<h3>文本編輯</h3>',editorOption: {}}},components: {NavHeader,quillEditor,},computed: {editor() {return this.$refs.myQuillEditor.quill}},methods: {onEditorReady(editor) {console.log('editor ready!', editor)},submit(){console.log(this.content);this.$message.success('提交成功！');}}

　　這樣就已經完成了，但是有的時候在頁面中 這樣之后，樣式會全部亂掉解決辦法

main.js 中

import 'quill/dist/quill.core.css' import 'quill/dist/quill.snow.css' import 'quill/dist/quill.bubble.css' import VueQuillEditor from 'vue-quill-editor'Vue.use(VueQuillEditor);

　　

轉載于:https://www.cnblogs.com/haonanZhang/p/8410187.html

總結

以上是生活随笔為你收集整理的Vue2 封装的 Quill 富文本编辑器组件 Vue-Quill-Editor的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。