为何quill-delta无法正确输出右对齐属性？

问题背景 #

基于 react-quill 和 Delta 开发编辑器，选择 Delta 是因为需要从编辑器外部直接编辑内容，该方案适配需求。

问题描述 #

Delta 无法正确包含右对齐属性，预期输出：

{"ops":[{"insert":"center", "attributes":{"align":"center"}},{"insert":"\nright", "attributes":{"align":"right"}}]}

实际得到的 Delta：

{"ops":[{"insert":"center\nright"},{"attributes":{"align":"center"},"insert":"\n"}]}

这种结构导致从 Quill 外部读取时，无法判断“right”文本需设置为右对齐，疑惑操作是否有误，或对 Delta 工作原理理解偏差。

核心原因：Quill Delta 块级属性的工作逻辑 #

Quill 中的 align 是块级属性，它不会直接绑定在文本内容的 insert 节点上，而是作用于段落末尾的换行符 \n。这是你产生理解偏差的关键：

• 你预期对齐属性和文本绑定，但实际上 Quill 会将块级属性附加到段落结束的换行符节点，以此标记整个段落的对齐方式。

正确的 Delta 结构示例 #

要实现“center”居中、“right”右对齐的效果，正确的 Delta 结构应为：

{
  "ops": [
    {"insert": "center"},
    {"insert": "\n", "attributes": {"align": "center"}},
    {"insert": "right"},
    {"insert": "\n", "attributes": {"align": "right"}}
  ]
}

每个段落的对齐属性都附着在对应段落结尾的换行符上，而非文本内容节点。

解决与调整方案 #

1. 验证结构：在编辑器中手动设置两段文本的对齐，导出 Delta 查看结构，直观理解块级属性的绑定方式。
2. 外部编辑 Delta 时的规范：需要将 align 属性添加到对应段落的换行符节点，不要和文本合并在同一个 insert 对象中。
3. 读取 Delta 的逻辑调整：通过换行符节点的 attributes 判断其前面段落的对齐方式，而非从文本节点获取属性。

内容的提问来源于 stack exchange，提问作者 Malo Marrec