tiptap 有序列表

如果一个项目符号列表看起来不够正式，可以在前面加上一些数字。

这个扩展允许你在编辑器中使用有序列表。它们将以 <ol> HTML 标签的形式显示。

在新的一行开始时输入 1. （或其他任何数字后面跟着一个点），它会神奇地变成一个有序列表。

安装


npm install @tiptap/extension-ordered-list @tiptap/extension-list-item

此扩展需要 ListItem 节点。

自定义应添加到渲染 HTML 标签的自定义 HTML 属性。


OrderedList.configure({
  HTMLAttributes: {
    class: "my-custom-class",
  },
});

指定列表项的名称。

默认值：'listItem'


OrderedList.configure({
  itemTypeName: "listItem",
});

决定在使用 inputRule 或按钮切换列表后是否保留上一行的标记。

默认值：false


OrderedList.configure({
  keepMarks: true,
});

决定在使用 inputRule 或按钮切换列表后是否保留上一行的属性。

默认值：false


OrderedList.configure({
  keepAttributes: true,
});

切换有序列表。


editor.commands.toggleOrderedList();

命令	Windows/Linux	macOS
toggleOrderedList	`Ctrl` + `Shift` + `7`	`Cmd` + `Shift` + `7`