一、前言

在一些博客、评论相关的位置，我们不会简单使用 HTML 中的 input 或者 textarea 等纯文本，需要用到富文本编辑器，即实现可以对文本进行加粗、变色、改变字体及大小等操作。

本文借助的是vue-quill-editor，这个对vue支持比较友好

GitHub地址：https://github.com/surmon-china/vue-quill-editor

官网地址：https://quilljs.com/docs/quickstart/

二、代码

1.安装 vue-quill-editor

npm install vue-quill-editor

2.导入 vue-quill-editor

在 mian.js 中

// 导入第三方富文本编辑器import VueQuillEditor from 'vue-quill-editor'// 导入第三方文本编辑器样式import 'quill/dist/quill.core.css'import 'quill/dist/quill.snow.css'import 'quill/dist/quill.bubble.css'

3.具体页面

三、效果

四、其他

我们存储到数据库中的，是带样式标签的字符串，要复现富文本内容，只需使用 vue 的 v-html 属性即可：