文档结构

每个 BlockNote 文档由一系列块组成。
块是内容的一部分，比如段落、标题、列表项或图片。用户可以在编辑器中拖动块。块包含一段内容，并且可以包含嵌套的（子）块：

块

Block 类型用于描述编辑器中的任意块：

type Block = {
  id: string;
  type: string;
  props: Record<string, boolean | number | string>;
  content: InlineContent[] | TableContent | undefined;
  children: Block[];
};

块属性

• id：块的 ID。多个块不能共用一个 ID，且块在创建后直到被移除之前都会保持相同的 ID。

• type：块的类型，比如段落、标题或列表项。关于内置块类型的概览，见内置块。

• props：块的属性，是一组键值对，用于进一步指定块的外观和行为。不同的块类型有不同的 props——详细请见内置块。

• content：块的富文本内容，通常表示为一个 InlineContent 对象数组。这里不包含任何嵌套块的内容。请继续阅读内联内容了解更多。

• children：块内部嵌套的任何块。嵌套块也用 Block 对象表示。

内联内容

块的 content 字段包含块的富文本内容。它定义为 InlineContent 对象数组。内联内容可以是带样式的文本或链接（如果你自定义了编辑器的 schema，则也可以是自定义的内联内容类型）。

内联内容对象

InlineContent 类型用于描述一段内联内容：

type Link = {
  type: "link";
  content: StyledText[];
  href: string;
};

type StyledText = {
  type: "text";
  text: string;
  styles: Styles;
};

type InlineContent = Link | StyledText;

styles 属性将在下文说明。

样式与富文本

StyledText 对象的 styles 属性用于描述这段文本的富文本样式（如：粗体、斜体、颜色）或其他属性。它是一组指定应用于文本的样式的键值对。

请参见默认 Schema了解 BlockNote 默认包含哪些样式。

亲自体验

下面的演示显示了编辑器内容（文档）的 JSON。它是一个 Block 对象数组，随你在编辑器中输入实时更新：

特殊情况

虽然大多数块使用 InlineContent 数组描述其内容（如段落、标题、列表项），有些块，如图片则不包含任何富文本内容，因此它们的 content 字段为 undefined。

列块（Column Blocks）

@blocknote/xl-multi-column 包允许你在列中并排排列块。它引入了两种额外的块类型：列和列列表：

type ColumnBlock = {
  id: string;
  type: "column";
  props: { width: number };
  content: undefined;
  children: Block[];
};

type ColumnListBlock = {
  id: string;
  type: "columnList";
  props: {};
  content: undefined;
  children: ColumnBlock[];
};

尽管这两者表现为普通块，使用时须注意以下额外限制：

• 列的子块必须是普通块
• 列列表的子块必须是列
• 列列表中至少必须有两个列

表格

表格 也不一样，包含 TableContent。其中，每个表格单元格表示为 InlineContent 对象数组：

type TableContent = {
  type: "tableContent";
  rows: {
    cells: InlineContent[][];
  }[];
};