vue后台管理系统项目-vue-quill-editor实现富文本编辑器功能

置顶船长在船上

已于 2023-07-24 14:26:41 修改

阅读量1.8k

点赞数 1

CC 4.0 BY-SA版权

分类专栏： Vue vue项目非常实用的功能整理 vue后台系统管理项目全套功能文章标签： vue.js 前端 javascript

于 2022-12-24 12:34:44 首次发布

本文链接：https://blog.youkuaiyun.com/SmartJunTao/article/details/128426978

vue项目非常实用的功能整理同时被 3 个专栏收录

27 篇文章 ¥19.90 ¥99.00

订阅专栏

超级会员免费看

vue后台系统管理项目全套功能

15 篇文章 ¥19.90 ¥99.00

订阅专栏

超级会员免费看

Vue

198 篇文章

订阅专栏

本文详细介绍了在Vue后台管理系统中使用vue-quill-editor实现富文本编辑器的全过程，包括全局和局部引入、配置option、自定义文字大小等。并提供了 vant-ui 和 element 图片上传功能的实现方法，以及处理粘贴样式和本地图片的策略。同时，文章还分享了如何扩展编辑器以支持更多字体大小选项，涉及对quill核心文件的修改。

富文本编辑器功能实现详细过程

1.安装富文本插件

npm install vue-quill-editor --save
//或者
yarn add vue-quill-editor

2.实现效果

3.实现详细过程可直接使用

全局引入

main.js注册

import quillEditor from 'vue-quill-editor'
import 'quill/dist/quill.core.css'
import 'quill/dist/quill.snow.css'
import 'quill/dist/quill.bubble.css'
Vue.use(VueQuillE

了解本专栏