elementui 使用富文本选择器

最新推荐文章于 2024-06-25 09:48:37 发布

xniYa!

最新推荐文章于 2024-06-25 09:48:37 发布

阅读量603

点赞数

分类专栏： element 文章标签： elementui javascript 前端

本文链接：https://blog.csdn.net/qq_52134424/article/details/127283425

版权

本文档详细介绍了如何在ElementUI中使用富文本选择器，从安装、引入到配置和使用，提供了完整的步骤指导。

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

1.安装

npm install vue-quill-editor –save

2.引入

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.配置

// 工具栏配置
const toolbarOptions = [
  ['bold', 'italic', 'underline', 'strike'], // 加粗 斜体 下划线 删除线
  ['blockquote', 'code-block'], // 引用  代码块
  [{ header: 1 }, { header: 2 }], // 1、2 级标题
  [{ list: 'ordered' }, { list: 'bullet' }], // 有序、无序列表
  [{ script: 'sub' }, { script: 'super' }], // 上标/下标
  [{ indent: '-1' }, { indent: '+1' }], // 缩进
  // [{'direction': 'rtl'}],                         // 文本方向
  [{ size: ['small', false, 'large', 'huge'] }], // 字体大小
  [{