探索 Tiptap V3 的最新功能

行高扩展

版本下载量

此扩展使您能够在编辑器中设置背景颜色。它使用 TextStyle 标记,该标记呈现为 <span> 标签(仅此而已)。背景颜色随后作为内联样式应用,例如 <span style="background-color: #958DF1">

安装

npm install @tiptap/extension-text-style

此扩展需要 TextStyle 标记。

import { Editor } from '@tiptap/core'
import { TextStyle, LineHeight } from '@tiptap/extension-text-style'

new Editor({
  extensions: [TextStyle, LineHeight],
})

此扩展默认与 TextStyleKit 扩展一起安装,因此您无需单独安装它。

import { Editor } from '@tiptap/core'
import { TextStyleKit } from '@tiptap/extension-text-style'

new Editor({
  extensions: [TextStyleKit],
})

设置

types

应应用颜色属性的标记列表。

默认值: ['textStyle']

LineHeight.configure({
  types: ['textStyle'],
})

命令

setLineHeight()

将给定的行高应用为内联样式。

editor.commands.setLineHeight('1.1')

unsetLineHeight()

移除任何行高。

editor.commands.unsetLineHeight()

源代码

packages/extension-text-style/src/line-height/

最小安装

import { Editor } from '@tiptap/core'
import { LineHeight } from '@tiptap/extension-text-style/line-height'

new Editor({
  extensions: [LineHeight],
})