npm install tiptap-extension-bullet-list -S
const listType = e.target.dataset.listType; // circle disc square
let chain = editor.chain().focus();
// 开启列表类型
if (!editor.isActive('bulletList')) {
chain.toggleBulletList().updateAttributes('bulletList', { listStyleType });
}
// 切换列表类型
else if (editor.getAttributes('bulletList').listStyleType !== listStyleType) {
chain.updateAttributes('bulletList', { listStyleType });
}
// 关闭列表类型
else {
chain.toggleBulletList();
}
Add listStyleType
option, other options are same as @tiptap/extension-bullet-list
import BulletList from "tiptap-extension-bullet-list";
const editor = new Editor({
element: document.querySelector(".editor"),
extensions: [
StarterKit,
BulletList.configure({
listStyleType: 'disc', // default disc
HTMLAttributes: { class: "list-paddingleft-1" }
}),
],
});
@tiptap/extension-bullet-list: https://github.com/ueberdosis/tiptap/tree/develop/packages/extension-bullet-list
tiptap-appmsg-editor: https://github.com/KID-1912/tiptap-appmsg-editor