vue3-富文本编辑器(vue-quill)

官网:VueQuill | Rich Text Editor Component for Vue 3

安装

 pnpm add @vueup/vue-quill@latest

使用

局部使用

先导包

import { QuillEditor } from '@vueup/vue-quill'
import '@vueup/vue-quill/dist/vue-quill.snow.css';

再使用

<QuillEditor theme="snow"></QuillEditor>

添加数据双向绑定,注意要一起设置内容类型

          <QuillEditor
            v-model:content="formModel.content"
            content-type="html"
            theme="snow"
          ></QuillEditor>

重置内容

组件ref名.value.setHTML(内容)
相关推荐
觉醒法师几秒前
HarmonyOS开发 - 电商App实例二( 网络请求http)
前端·http·华为·typescript·harmonyos·ark-ts
沈剑心几秒前
Kotlin的协程,真能提升编程效率么?
android·前端·kotlin
ZXT11 分钟前
项目精讲 - keepAlive
vue.js
堕落年代11 分钟前
Vue主流的状态保存框架对比
前端·javascript·vue.js
没资格抱怨12 分钟前
el-pagination的使用说明
javascript·vue.js·elementui
沐千熏17 分钟前
Liunx(CentOS-6-x86_64)使用Nginx部署Vue项目
vue.js·nginx·centos
OpenTiny社区21 分钟前
TinyVue的DatePicker 组件支持日期面板单独使用啦!
前端·vue.js
冴羽22 分钟前
Svelte 最新中文文档教程(22)—— Svelte 5 迁移指南
前端·javascript·svelte
树上有只程序猿26 分钟前
Vue3组件通信:多个实战场景,轻松玩转复杂数据流!
前端·vue.js
青红光硫化黑31 分钟前
React基础之useEffect
javascript·react.js·ecmascript