鍍金池/ 問答/HTML/ vue-quill-editor怎么使用

vue-quill-editor怎么使用

看API各種百度使用vue-quill-editor，就是出不來啊啊啊啊啊啊啊，，，，，
我的組件代碼是這樣的：

<template>
<section class="editor" style="height: 800px;">

 <quill-editor class="quill-editor" ref="myTextEditor" v-model="content" :config="editorOption"></quill-editor>

</section>
</template>
<script>
import { quillEditor } from 'vue-quill-editor'
export default {

 name:'UE',
 data:function () {
   return {
     content:'',
     editorOption:{

     }
   }
 },

 methods:{
   getUEContent(){
     return this.editor.getContent()
   }
 },
 components:{
   quillEditor
 }

}
</script>
<style>
.quill-editor {

height: 745px;

}
</style>

結(jié)果是：

clipboard.png

下面還有一堆奇形怪狀的樣子，應(yīng)該是哪一項沒配置，，求指教QAQ---

回答
編輯回答
青黛色

引入樣式

import 'quill/dist/quill.core.css'
import 'quill/dist/quill.snow.css'
<quill-editor :options="editorOption"
                          ref="QuillEditor"
                          @blur="onEditorBlur($event)" @focus="onEditorFocus($event)"
                          @change="onEditorChange($event)"
                          @ready="onEditorReady($event)">
            </quill-editor>
  computed: {
            editor() {
                return this.$refs.QuillEditor.quill
            }
        }
onEditorChange({editor, html, text}) {
                this.content=html;
                console.log(html)
            },
            onEditorFocus() {

            },
            onEditorReady() {

            },
            onEditorBlur() {

            },
2017年3月10日 00:45