Vue CKEditor5 快速了解并使用 您所在的位置:网站首页 ckeditor4与5区别 Vue CKEditor5 快速了解并使用

Vue CKEditor5 快速了解并使用

2024-04-14 09:07| 来源: 网络整理| 查看: 265

官方Demo 中有几个官方封装的编辑器可以 根据需求 调整工具栏后直接进行使用,也可以在这个基础上进行自定义。

经典编辑器(classic):

经典编辑器是大多数用户传统上学习与富文本编辑器相关联的东西,一个工具栏,其编辑区域放置在页面上的特定位置,通常作为表单的一部分,用于向服务器提交一些内容。

$ npm install --save @ckeditor/ckeditor5-build-classic

内联编辑器(inline):

内联编辑器带有一个浮动工具栏,当编辑器获得焦点时(例如通过单击它),该工具栏变得可见。与经典编辑器不同,内联编辑器不会呈现给定元素,它只是使其可编辑。因此,编辑内容的样式在创建编辑器之前和之后将完全相同。

使用内联编辑器的一个常见场景是为用户提供在网页上实际位置编辑内容的可能性,而不是在单独的管理部分中进行。

$ npm install --save @ckeditor/ckeditor5-build-inline

气球编辑器(balloon):

气球块编辑器可以让你直接在目标位置创建内容,气球编辑器与内联编辑器非常相似。

$ npm install --save @ckeditor/ckeditor5-build-balloon

气球块编辑器(balloon-block):

气球块本质上是 气球编辑器 带有一个额外的块工具栏,可以使用附加到可编辑内容区域的按钮并按照文档中的选择进行访问。工具栏提供对其他块级编辑功能的访问。

$ npm install --save @ckeditor/ckeditor5-build-balloon-block

文档编辑器(document):

文档编辑器专注于类似于原生文字处理器的富文本编辑体验。它最适合创建通常稍后打印或导出为 PDF 文件的文档。

$ npm install --save @ckeditor/ckeditor5-build-document

文档分页编辑器(document-paged):

跟 文档编辑器 差不多,但是多了分页相关的功能。

$ npm install --save @ckeditor/ckeditor5-build-document-paged


【本文地址】

公司简介

联系我们

今日新闻

    推荐新闻

    专题文章
      CopyRight 2018-2019 实验室设备网 版权所有