Quill中文文档
  • 简介
  • 文档(Document)
    • 快速开始(QuickStart)
    • 下载(Download)
    • 配置项(Configuration)
    • 格式化(Formats)
    • API
      • content
      • formatting
      • selection
      • editor
      • events
      • model
      • extension
    • Delta
    • 模块(Modules)
      • 工具栏(Toolbar)
      • 键盘(Keyboard)
      • 历史(History)
      • 剪贴板(Clipboard)
      • 格式化(Formula)
      • 语法高亮(Syntax Highlighter)
    • 主题(Themes)
  • 指南(Guides)
    • 为什么要用Quill?(Why Quill)
    • 怎么自定义Quill
    • 将Quill添加到你的构建系统
    • 构建自定义模块
    • 通过Parchment克隆Medium
    • 设计Delta的格式
    • 与其他富文本编辑器对比
    • 升级到1.0
  • 其他相关库(Other)
    • Parchment
    • 自定义总结
  • 更新日志
Powered by GitBook
On this page
  • API驱动设计
  • 自定义内容个格式化
  • 跨平台
  • 使用方便
  1. 指南(Guides)

为什么要用Quill?(Why Quill)

内容创作从一开始就是网络的核心。<textarea>几乎为任何web应用程序提供了原生和基础的解决方案。但是在某些时候,你可能需要添加格式到文本输入框中。这就是富文本编辑器的由来。有许多的解决方案可供选择,但是Quill带来了一些现代的想法和思考。

API驱动设计

富文本编辑器旨在帮助人们编写文本。令人惊讶的是,大多数富文本编辑器不知道用户编写了什么文本。这些编辑器通过和web开发人员一样的方式来查看内容:DOM。由于DOM使用不平衡的节点组成,而文本由线、字和字符组成,所有变现出不匹配的情况。

没有字符为度量单位的API。有了这个限制,大多数富文本编辑器不能回答诸如:“这个范围内有什么文字?”或者“光标处是粗体吗?”的简单问题。试图在这些原始的基础上简历丰富的编辑体验是非常困难和难受的。

Quill是专为编辑和字符设计的,并且已自然文本为中心的基础上构建它的API。要找出某些文字是否是粗体,Quill不需要遍历DOM查找<b>或者<strong>节点或者一个font-weight样式属性,只需调用getFormat(5, 1)。所有核心API调用都允许任意索引、访问的长度或者修改。其事件API还会以直观的JSON格式报告更改。不需要解析HTML或者diff DOM树。

自定义内容个格式化

过去,评估富文本编辑器的就像比较所需格式的清单一样简单。一个好的富文本编辑器的标志就是它支持多少的格式。这仍然是一个重要的措施,但是下限正在接近无限。

文本的编写不再是为了打印。它被编写是为了在网络上展示————一个比纸张更加丰富的画布。内容可以是实时的、互动的、甚至是协作的。只有一些富文本编辑器支持简单的媒体,如:图片和视频;几乎没有能够嵌入推特或者交互式图形。然而,这是网络发展的方向:更加丰富并且拥有更多的互动。支持内容创建的工具需要考虑这些用例。

Quill公开了它自己的文档模型,这是对DOM的一个强大的抽象,允许扩展和定制。Quill支持的格式和内容的上限是无限的。用户已经使用它来添加幻灯片、交互式清单和3D模型。

跨平台

跨平台的支持对于许多库俩说是重要的,但这也意味着所有的标准也是不同的。对于Quill来说,阻碍不仅仅是能否运行和工作,而是以相同的方式运行和工作。功能不仅是一个跨平台的考虑,而且用户和开发者的经验也是如此。如果某些内容在OSX上的额Chrome上产生了特定的标记,那么它会在IE上产生相同的标记。如果在Windows上的Firefox上保留了粗体的样式,它将被保存在移动Safari上。

使用方便

所有的好处都来自于一个易于使用的包。Quill拥有合适的默认值,你能够通过几行JavaScript代码就能使用它。

var quill = new Quill('#editor', {
  modules: { toolbar: true },
  theme: 'snow'
});

如果不是你的应用程序需要,你就不必自定义Quill,只需享受开箱即用的丰富而一致的体验。

请享用!

Previous指南(Guides)Next怎么自定义Quill

Last updated 5 years ago