Markdown
@astryxdesign/core v0.7.1 · Markdown
Props
| 名称 | 类型 | 默认值 | 说明 |
|---|---|---|---|
content | string | — | Markdown 源码。省略时使用默认插槽里的文本。 |
contentAlign | 'start' | 'center' | 'start' | 设置了 contentWidth 时,正文行宽的水平对齐。 |
contentWidth | number | string | — | 正文最大宽度。数字按像素。表格和代码块仍占满容器。 |
components | MarkdownComponents | — | 替换某一类节点的渲染。可选键:blockquote、code、heading、hr、image、inlineCode、link、list、paragraph、table。 |
density | 'default' | 'compact' | 'default' | compact 收紧块与块之间的间距。 |
display | 'block' | 'inline' | 'block' | inline 把源码当成短语,渲染在 span 里。 |
headingLevelStart | 1 | 2 | 3 | 4 | 5 | 6 | 1 | Markdown 里的 # 对应的标题级别。更深的标题一起后移,到 h6 为止。 |
isStreaming | boolean | false | 只重新解析最后一个未完成的块,并为新文字播放淡入。不做逐字平滑。逐字揭示请先用 useStreamingText,再把结果传给 content。 |
onLinkClick | (href: string, event: MouseEvent) => void | false | — | 链接被点击时调用。返回 false 会取消跳转。 |
plugins | MarkdownPlugin[] | — | 文档插件。可以替换语法树,并绘制自己的 extension 节点。 |
inlinePlugins | MarkdownInlinePlugin[] | — | 在普通文本上做匹配。不进入行内代码和围栏代码。 |
autolink | 'gfm' | — | 设为 gfm 时,裸网址、www. 和裸邮箱变成链接。 |
citationStyle | 'label' | 'number' | 'label' | 引用来源芯片是标题,还是序号徽章。 |
sources | Record<string, MarkdownSource> | — | 按 id 提供的引用来源。[id] 和 【id】 对上键时画成芯片。 |
插槽
| 名称 | 说明 |
|---|---|
default | 没传 content 时,当作 Markdown 源码的文本。 |
暴露
| 名称 | 类型 | 说明 |
|---|---|---|
element | HTMLElement | null | 根元素。 |
组合式函数
useStreamingText(targetText, isStreaming?, options?) 把一段不断变长的文本平滑成稳定的揭示。options.speed 可以是 natural、fast 或 instant。未在流式输出,或用户偏好减少动态效果时,直接返回全文。
字符级平滑只放在这一层。把返回值交给 Markdown 的 content,并用 isStreaming 打开分块解析和淡入。不要在 Markdown 外面再套一次 useStreamingText。
原生属性
块级渲染的根元素是 <div role="document">,行内渲染是 <span>。
以下内容传入根元素:
- HTML 属性。
aria-*属性。data-*属性。class。style。- 原生事件监听器。
传入 role 时使用传入的值。