FinDesc 描述列表

组件与命名规范：组件名主推 FDesc，别名导出 FinDesc。

基于 schema 配置的描述列表组件，支持多种渲染方式、动态显隐、格式化、点击事件等功能。

基础用法

通过 schema 和 data 配置描述列表。

loading

带边框

设置 border 属性显示边框。

loading

格式化显示

使用 formatter 对数据进行格式化。

loading

插槽渲染

通过具名插槽自定义内容渲染。

loading

动态组件

使用 component 属性渲染动态组件。

loading

动态显隐

通过 visible 函数控制项的显示。

loading

Render 函数

使用 render 函数返回 VNode 进行复杂渲染。

loading

点击事件

监听 item-click 事件响应点击。

loading

---

API

FinDescProps

属性	说明	类型	默认值
schema	描述项配置数组	FinDescItem[]	[]
data	数据源对象	Record<string, any>	{}
title	标题文本	string	—
extra	操作区文本	string	—
border	是否带有边框	boolean	false
column	一行显示的列数	number	3
direction	排列方向	'horizontal' | 'vertical'	'horizontal'
size	列表尺寸	'large' | 'default' | 'small'	'default'
labelWidth	标签宽度	string | number	—
labelAlign	标签对齐方式	'left' | 'center' | 'right'	'left'
align	内容对齐方式	'left' | 'center' | 'right'	'left'
colon	无边框模式下是否显示冒号	boolean	true
emptyText	空值占位符	string	'--'
customClass	自定义类名	string | string[] | Record<string, boolean>	—

FinDescItem

属性	说明	类型	默认值
key	唯一标识	string | number	—
label	标签文本	string	必填
field	数据字段名	string	—
value	直接指定值（优先级高于 field）	any	—
span	占据的列数	number	1
rowspan	占据的行数	number	1
width	列宽度	string | number	—
minWidth	最小列宽度	string | number	—
labelWidth	标签宽度	string | number	—
align	内容对齐方式	'left' | 'center' | 'right'	—
labelAlign	标签对齐方式	'left' | 'center' | 'right'	—
className	自定义类名	string	—
labelClassName	标签自定义类名	string	—
slot	插槽名称	string	—
visible	是否可见	boolean | ((params) => boolean)	true
formatter	格式化函数	(params) => any	—
render	渲染函数	(params) => VNodeChild	—
component	动态组件	string | Component	—
componentProps	组件 props	object | ((params) => object)	—

渲染优先级：slot > render > component > formatter > 默认值显示

params 参数：包含 { value, data, item, index } 四个字段

Events

事件名	说明	参数
item-click	点击描述项时触发	(item: FinDescItem, index: number)

Exposes

方法名	说明	类型
getSchemaData	获取当前可见的 schema 数据	() => FinDescItem[]
refresh	手动触发可见性重新计算	() => void

Slots

插槽名	说明	参数
title	自定义标题	—
extra	自定义操作区	—
[item.slot]	自定义描述项内容	{ value, data, item, index }