Skip to main content

Markdown编辑器

Markdown编辑器用于在页面中展示 Markdown 格式的内容,适合编写说明、公告、帮助文档等富文本排版内容。

概述​

将「Markdown编辑器」拖入画布后,可直接在画布中编辑 Markdown 内容,编辑结果即时渲染。属性抽屉中提供左右内边距的调节。

内容在用户态支持系统环境变量占位符。

配置项​

配置项说明
内容Markdown 文本,在画布中直接编辑
左右内边距内容区左右内边距,取值 0 ~ 40(%),步长 5,默认 0

使用建议​

  1. 需要较强的富文本排版(表格、标题层级、代码块)时使用本组件。
  2. 需要所见即所得的可视化排版时使用 富文本。

下一步​

属性明细​

以下内容面向技术实现与 AI 检索。所有 meta 键值均以字符串形式存储。

组件属性(meta)​

属性名类型含义取值/存储值
ContentstringMarkdown 内容Markdown 文本,用户态支持系统环境变量占位符,默认空
PaddingLRstring(number)左右内边距(%)0(默认) ~ 40,步长 5

GetSidebarItemMeta() 默认写入 Content(空字符串),PaddingLR 在用户配置后写入。uid 固定为 bbc1da6a-b9e3-4d04-9887-c5e08cb39a10。

存储示例​

组件通常位于列(Column)内,以下为嵌套在行(Row)→ 列(Column)中的完整存储结构:

{
"id": "e5f6a7b8-0001-4a2b-8c3d-1234567890ab",
"uid": "5a0f3c1e-9b8d-4f6a-9c2e-7d1b4a8e6f3d",
"dragType": "Row",
"originalType": "Row",
"widgetType": "Row",
"widgetTypeName": "基础容器",
"meta": {
"ColumnSpace": "5"
},
"children": [
{
"id": "e5f6a7b8-0002-4a2b-8c3d-1234567890ab",
"uid": "7b9a905e-83d4-452b-83c8-694a3e0935e3",
"dragType": "Column",
"originalType": "Column",
"widgetType": "Column",
"widgetTypeName": "布局列组件",
"meta": {
"LayoutType": "vertical",
"Align": "default",
"ItemSpace": "5"
},
"children": [
{
"id": "e5f6a7b8-0003-4a2b-8c3d-1234567890ab",
"uid": "bbc1da6a-b9e3-4d04-9887-c5e08cb39a10",
"dragType": "Widget",
"originalType": "Widget",
"widgetType": "Markdown",
"widgetTypeName": "Markdown编辑器",
"meta": {
"Content": "# 使用说明\n\n- 第一步\n- 第二步",
"PaddingLR": "0"
},
"children": []
}
]
}
]
}