VEUI on GitHub

Column Table column


See Table examples.



titlestring-The column title.
fieldstring-The key name of the column, corresponds to a field of a data item in the data prop of the Table component.
widthstring=|number-The width of the column in pixel value.

Whether this column supports sorting.

alignstring-The alignment of the column content, supports left / center / right.
spanfunction(number): Object

Cell merge configuration. The type is function(index: number): { row: number, col: number }. index is the index of the current row in the data prop of the Table component. The row / col properties of the return value correspond to the rowspan / colspan of the cell, and the default values are both 1.

descstring-The description of the table header.
fixedboolean | 'left' | 'right'falseWhether the column is fixed. 'left' means fixed on the left side, 'right' means fixed on the right side.


The filter condition value. The value null means not filtered. When filter-multiple is true, the value is an array of selected item values.

filter-multiplebooleanfalseWhether the built-in filter is multi-select.
filter-optionsArray<Object>-The filtering options list, the item type is {label, value, options, disabled, ...}, refer to the options prop of the Select component.
filter-titlestring-The title of the filter drop-down.
allowed-ordersArray[false, 'desc', 'asc']

Specifies the sorting range of this column. When the user clicks, it will switch in the order specified.

falseNo sorting.
'asc'Ascending order.
'desc'Descending order.
tooltipboolean | ((item: Object) => string)-Whether to automatically display a hover tooltip when the content overflows. The default is to display the textContent of the current cell. When a function is passed in, the item parameter is the entire data item, and the returned string will be displayed as the tooltip content.


headThe column header area.

The column footer area.


The content of the cell.

Default content: The value of the field corresponding to the field prop in the table data item.

The slot props are all properties in the current row data in data.


The content of the sub-row after the row is expanded. When using this slot, the content will be the cell content of the corresponding column in the expanded sub-row below the row. The row data source comes from the children array in data corresponding to the main row data, and the number of expanded sub-rows is the same as the number of data items in children, using the same column configuration.

Default content: The value of the field corresponding to the field prop in the table data[i].children[j] item.

The slot props are all properties in the current sub-row data and the current main row corresponding index value index.


The description of the header. When using this slot, it will override the desc prop of the Column.

closefunction(): voidClose the container that displays the description content.

The content of the filter layer.

closefunction(): voidClose the filter layer.


filterchangeTriggered when the filter of this column is modified. The callback parameter is (value). value is the current value of the filter.
Edit this page on GitHubEdit
© Baidu, Inc. 2023