如何在vue中使用Vue-Quill-Editor

最新推荐文章于 2024-08-21 09:52:22 发布

勤奋的七仔

最新推荐文章于 2024-08-21 09:52:22 发布

阅读量476

点赞数

本文链接：https://blog.csdn.net/XiehaiyanLI/article/details/108603782

版权

本文介绍了在Vue项目中使用Vue-Quill-Editor的步骤，包括访问官网获取资源，安装vue-quill-editor及quill依赖，以及如何在组件中引入并使用富文本编辑器。

摘要由CSDN通过智能技术生成

官网地址：Vue-Quill-Editor

下载安装vue-quill-editor

npm install vue-quill-editor --save

安装quill

npm install quill --save

在页面中引入

import {
    quillEditor } from 'vue-quill-editor' // 调用富文本编辑器
import 'quill/dist/quill.snow.css' // 富文本编辑器外部引用样式
import * as Quill from 'quill'; // 富文本基于quill

在组件或页面中使用

<quill-editor
  v-model="content"
  ref="myQuillEditor"
  :options="editorOption"
  @focus="onEditorFocus($event)"
  @change="onEditorChange($event)"
></quill-editor>