前言:Vue的生态已经越来越繁荣,越来越多有趣好用的组件加入的生态中了。quill-editor富文本编辑器就是很好用的组件之一。
一、quill-editor的安装与使用
①、安装
npm install vue-quill-editor --save
②、引用组件
<template>
<div id="Test">
<quill-editor ref="myTextEditor"
v-model="content">
</quill-editor>
</div>
</template>
<script>
import { quillEditor } from 'vue-quill-editor'
export default {
components: {
quillEditor
},
data () {
return {
content: '<h2>hello quill-editor</h2>',
}
}
}
</script>
<style>
</style>
像这样quill-editor组件就引用成功了。
③、关于样式乱了的问题
有许多朋友反映,像上面代码中引用quill-editor组件后,发现在页面中富文本编辑器没有样式。