排版块
排版块是用于在文档中显示文本内容的基本元素。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: 标题是否可切换(子内容是否隐藏)。仅在 allowToggleHeadings 为 true(默认)时存在。默认值为 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[];
};分割线块无属性且无内容。可通过在空行输入 --- 来插入。