EnTableSortable

Preview

Props

Name	Description	Default	Control
headings	An array containing the labels for the columns of the table and optional key that matches to data in the row object. array	[…]	complex object
rows	An array of table data containing objects or array of strings or numbers, where each object/array is a row of table data. Objects are recommended for full feature use. array	[…]	complex object
rowType	The type of each row of the table. string	"object"
headerClass	CSS class that will be applied to all table headers. string	""
wrapHeader	Whether or not the text in the table headers should be wrapped. boolean	true	truefalse
enableBulkAction	Enables checkboxes for bulk actions. NOTE: must have a v-model binding to an array to work properly. boolean	false	truefalse
bulkActionProperty	Sets a property to pull from each selected item instead of the full object. e.g. set to 'Id' if you want to only include the Id from the selected objects. string	null
perPage	number	0
currentPage	number	1
qaId	Id that can be set for automation selectors. string	""

Slots

${slot}-prelabel

Dynamically generated slot based on the key or slot property in the heading object; renders content before the heading label

body

No description

Variables

Name	Type	Description
rows	unknown	—

${slot}

Dynamically generated slot based on the key or slot property in the heading object; used to modify the columns display value

Variables

Name	Type	Description
content	any	Default display value
row	object	Full row object
row-index	number	Row index, does not take any pagination into account
heading-index	number	Column index

Events

update:model-value

No description

sort

No description

Methods

No methods defined.

Types

SortableTableHeading - Object

Name	Type	Description
label	string	Display text for the column header.
key	string	Identifier for the location of the data for this column.
slot	string	The name of the slot created for the data in the cell and the header; defaults to the key unless a value is provided.
class	string	Applies a CSS class to both the header and the table cell.
headerClass	string	Applies a CSS class to just the header.
renderInTable	boolean	Filters the heading out of the table so it will not display.
active	boolean	Whether this column's sorting should be active or not.
reversed	boolean	Whether this column's sorting should be reversed or not.
isSortable	boolean	Whether this column is sortable.
sortType	"none""numeric""date"	Specify how to sort the data when sorting is used.
compare	CompareFn	Custom compare function for sorting.

CompareFn - function

Name	Type	Description
a	*	—
b	*	—