BlockNote Docs特性内置模块排版

排版块

排版块是用于在文档中显示文本内容的基本元素。BlockNote 支持多种排版块,帮助你有效地构建和格式化内容。

段落

类型与属性

type ParagraphBlock = {
  id: string;
  type: "paragraph";
  props: DefaultProps;
  content: InlineContent[];
  children: Block[];
};

标题

配置选项

type HeadingBlockOptions = Partial<{
  defaultLevel?: number;
  levels?: number[];
  allowToggleHeadings?: boolean;
}>;

defaultLevel: 未设置级别时创建/插入标题的默认级别,默认为 1

levels: 块支持的标题级别,默认是 [1, 2, 3, 4, 5, 6]

allowToggleHeadings: 是否支持切换标题,默认是 true。切换标题拥有一个按钮,可以切换隐藏或显示该块的子内容。

类型与属性

type HeadingBlock = {
  id: string;
  type: "heading";
  props: {
    level: 1 | 2 | 3 | 4 | 5 | 6 = 1;
    isToggleable?: boolean;
  } & DefaultProps;
  content: InlineContent[];
  children: Block[];
};

level: 标题级别,表示标题 (level: 1)、副标题 (level: 2) 以及子标题 (level: 3, level: 4, level: 5, level: 6)。默认值为 1

isToggleable: 标题是否可切换(子内容是否隐藏)。仅在 allowToggleHeadingstrue(默认)时存在。默认值为 false

引用

类型与属性

type QuoteBlock = {
  id: string;
  type: "quote";
  props: {
    backgroundColor: string;
    textColor: string;
  };
  content: InlineContent[];
  children: Block[];
};

backgroundColor: 块的背景颜色。默认值为 "default"

textColor: 块的文本颜色。默认值为 "default"

分割线

用于分隔内容的水平线。

类型与属性

type DividerBlock = {
  id: string;
  type: "divider";
  props: {};
  content: undefined;
  children: Block[];
};

分割线块无属性且无内容。可通过在空行输入 --- 来插入。