Descriptions

Display multiple fields in list form.

Basic usage

Sizes

Vertical List

Customized Style

Descriptions API

Descriptions Attributes

Name	Description	Type	Default
border	with or without border	`boolean`	false
column	numbers of `Descriptions Item` in one line	`number`	3
direction	direction of list	`enum`	horizontal
size	size of list	`enum`	—
title	title text, display on the top left	`string`	''
extra	extra text, display on the top right	`string`	''

Descriptions Slots

Name	Description	Subtags
default	customize default content	Descriptions Item
title	custom title, display on the top left	—
extra	custom extra area, display on the top right	—

DescriptionsItem API

DescriptionsItem Attributes

Name	Description	Type	Default
label	label text	`string`	''
span	colspan of column	`number`	1
width	column width, the width of the same column in different rows is set by the max value (If no `border`, width contains label and content)	`string` / `number`	''
min-width	column minimum width, columns with `width` has a fixed width, while columns with `min-width` has a width that is distributed in proportion (If no`border`, width contains label and content)	`string` / `number`	''
align	column content alignment (If no `border`, effective for both label and content)	`enum`	left
label-align	column label alignment, if omitted, the value of the above `align` attribute will be applied (If no `border`, please use `align` attribute)	`enum`	''
class-name	column content custom class name	`string`	''
label-class-name	column label custom class name	`string`	''

DescriptionsItem Slots

Name	Description
default	customize default content
label	custom label

Source

Component • Docs

Contributors

Delyan Haralanov

Herrington Darkholme