关于vue中富文本编辑器的使用

首先是需要我们进行对相应依赖的安装

npm install vue-quill-editor –save

然后是引入相对于的文件

import { quillEditor } from 'vue-quill-editor
import 'quill/dist/quill.core.css'
import 'quill/dist/quill.snow.css'
import 'quill/dist/quill.bubble.css'

这两部的操作其实与其他的插件的使用时一样的，不做多余的阐述。

3、新增自定义功能
1 ) Quill中富文本编辑的操作按钮都为英文，需要中文译一下，根据项目功能需求有两种情况：

如果有语言切换的需求，就需要准备语言包按照api的引用方法实现；
如果只有一种语言的要求，就可以通过css的content属性更改。
2）按钮多为图标显示，用户使用起来不能清楚明白功能按钮的作用，需要加上一个鼠标停留按钮提示的交互：

首先建一个quill-title.js
将每个按钮的对应class拾取出来进行提示语循环增加title
其次将quill-title.js引入

import { addQuillTitle } from ‘./modules/quill-title.js’
最后在生命周期mounted中调用方法：
addQuillTitle();
最终实现了鼠标悬停按钮完成tooltip提示。
摘自CSDN博主「乐夫天命兮」的原创文章
原文链接：https://blog.csdn.net/wangxinxin1992816/article/details/86294262/
相关代码可以查看