探索 Tiptap V3 的最新功能

详情扩展

版本下载量

详情扩展使您能够在编辑器中使用 <details> HTML 标签。这非常适合显示和隐藏内容。

安装

npm install @tiptap/extension-details

此扩展要求 DetailsSummaryDetailsContent 节点。

设置

persist

指定打开状态是否应保存在文档中。默认为 false

Details.configure({
  persist: true,
})

openClassName

指定切换内容时设置的 CSS 类。默认为 is-open

Details.configure({
  openClassName: 'is-open',
})

HTMLAttributes

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

Details.configure({
  HTMLAttributes: {
    class: 'my-custom-class',
  },
})

命令

setDetails()

将内容包装在一个详情节点中。

editor.commands.setDetails()

unsetDetails()

解包详情节点。

editor.commands.unsetDetails()