安装方法一
1.运行vue ui命令进入vue项目的可视化面板
2.点击依赖按钮——安装依赖——运行依赖——输入== vue-quill-editor==选择并安装
安装方法二
在Vscode新建终端,输入== npm install vue-quill-editor --save == 回车安装完成
使用富文本编辑器组件
1.在mian.js文件中导入富文本编辑器
import VueQuillEditor from 'vue-quill-editor' // 导入富文本编辑
2.导入富文本编辑器对应的样式
import 'quill/dist/quill.core.css' // import styles
import 'quill/dist/quill.snow.css' // for snow theme
import 'quill/dist/quill.bubble.css' // for bubble theme
3.将富文本编辑器,注册为全局组件
Vue.use(VueQuillEditor)
4.在xxx.vue组件中使用富文本编辑器
// v-model实现数据的双向绑定
<quill-editor v-model="XXX"></quill-editor>
最终效果呈现
可参考官方文档:https://github.com/surmon-china/vue-quill-editor#vue-quill-editor