On this page

Descriptions 描述列表

Element Plus 描述组件文档

Hidden Title

基础用法：<s-descriptions :options="options" value="value2" label="key"></s-descriptions>

属性事件插槽简介

基础用法

成华主题

石景山主题

通常用法

每行展示多少项

垂直列表

slot插槽和 render

自定义样式

API

属性名	说明	类型	默认值
`options`	描述项配置列表	`ItemOptions[]`	-
`theme`	主题样式，支持 `default` / `chenghua` / `shijingshan`	string	`default`
`column`	一行展示的描述项数量	number	`3`
`labelWidth`	label 宽度，传 `auto` 时会按最长 label 自动计算	string / number	`auto`
`showAll`	是否完整展示文本；为 `false` 时通过 `s-tooltip` 省略展示	boolean	`false`
`label`	options 中作为标签文本的字段名	string	`label`
`value`	options 中作为内容值的字段名	string	`value`

ItemOptions

属性名	说明	类型	默认值
`label`	标签文本	string	-
`value`	内容值	any	-
`labelSlot`	自定义 label 插槽名	string	-
`valueSlot`	自定义 value 插槽名	string	-
`labelRender`	自定义 label 渲染函数，`option` 为当前描述项数据	`({ option, value, label, index }) => VNode \| string`	-
`render`	自定义 value 渲染函数，`option` 为当前描述项数据	`({ option, value, label, index }) => VNode \| string`	-
`filter`	内容值格式化函数，`option` 为当前描述项数据	`({ option, value, index, label }) => any`	-
`attrs`	透传给 `el-descriptions-item` 的属性	object	-
`labelAttrs`	透传给 label 内部 `s-tooltip` 的属性	object	-
`valueAttrs`	透传给 value 内部 `s-tooltip` 的属性	object	-

插槽

插槽名	说明	插槽参数
`default`	自定义完整描述内容，会覆盖 `options` 渲染	-
`labelSlot` 对应名称	自定义某一项 label	`{ option, label, value, index }`
`valueSlot` 对应名称	自定义某一项 value	`{ option, label, value, index }`

透传属性

组件默认开启 border，其他属性会继续透传给 Element Plus el-descriptions。