iter(g164): 描述列表支持竖排与标题操作区

This commit is contained in:
HIsheR
2026-10-26 16:09:59 +08:00
parent bb1625a06d
commit b533903994
7 changed files with 78 additions and 8 deletions
+13 -1
View File
@@ -698,7 +698,7 @@ const content = h(
section(
'sec-descriptions',
'描述列表',
'descriptions:label : value 网格,column 定列数(窄屏自动单列);bordered 切表格形态,span 让长字段占整行。',
'descriptions:label : value 网格,column 定列数(窄屏自动单列);bordered 切表格形态,span 让长字段占整行;layout=vertical 把字段名挪到值上方,extra 给标题行加操作区。',
descriptions({
title: '订单信息(纯网格 · 3 列)',
column: 3,
@@ -722,6 +722,18 @@ const content = h(
{ label: '收件地址', value: '浙江省杭州市余杭区文一西路 969 号', span: 2 },
],
}),
divider({ dashed: true }),
descriptions({
title: '竖排 + 标题操作区(窄栏场景)',
column: 2,
layout: 'vertical',
extra: [h('span', {}, '更新于 15:20'), button({ label: '刷新', variant: 'ghost', onClick: () => toast.info('已刷新') })],
items: [
{ label: '合同编号', value: 'HT-2026-0913' },
{ label: '签署日期', value: '2026-09-13' },
{ label: '备注', value: '续签两年,价格按季度结算;此列用 span 占满整行以演示长文本换行。', span: 2 },
],
}),
),
section(
'sec-segmented',