vue-quill-editor github地址:https://github.com/surmon-china/vue-quill-editor
官方文档地址:https://www.npmjs.com/package/vue-quill-editor
npm install vue-quill-editor --save
import Vue from ‘vue‘
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)
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
}
}
完成上述步骤之后即可使用
<template>
<div>
<quill-editor ref="myTextEditor" v-model="content" :options="editorOption" style="height:600px;"></quill-editor>
</div>
</template>
<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 {
data(){
return{
content: ‘‘,
editorOption: {
placeholder: ‘编辑文章内容‘
},
}
},
components: {
quillEditor
},
methods:{
onEditorChange({ editor, html, text }) {
this.content = html;
},
}
}
</script>
来源链接:https://www.jianshu.com/p/a6cba69d6e49
原文:https://www.cnblogs.com/fsg6/p/14289057.html