Vue Data Grid Column API

Columns

Full reference of CoreUI Data Grid column definition keys — labels, sorting, filtering, formatting and custom rendering.

Each entry in the columns array describes one column. key is the only required field. See Columns overview for a guided tour.

KeyTypeDescription
keystringProperty name in the item object (also the column id).
labelstringHeader label; falls back to key.
editableboolean | { type?, min?, max?, step?, options? }Opts the column into inline editing with a built-in text, number or select editor.
editorPopupbooleanRenders the editor-{key} slot in an overlay anchored to the cell instead of inline — for rich editors whose UI extends beyond the cell.
editValidate(value, item) => true | stringGates the commit — a returned message blocks it and marks the editor invalid.
sortablebooleanSet false to disable sorting for this column.
filterablebooleanSet false to remove the column’s filter button.
filterFn(value, filterValue, item) => booleanCustom predicate replacing the default case-insensitive contains.
filterType'text' | 'number' | 'date' | 'select'Operator set for the built-in filter menu; select renders the faceted set filter. Defaults to text.
resizablebooleanSet false to drop the resize handle for this column (when columnSizing is on).
movablebooleanSet false to exclude the column from drag-and-drop reordering.
hideablebooleanSet false to prevent hiding the column.
formatter(value, item) => stringFormats the cell value — cheap, stays on the scroll hot path.
widthnumberInitial column width in pixels - seeds columnSizing and drives the layout.
styleCSSPropertiesInline styles for the header cell (cosmetic; e.g. percentage widths are visual-only).

Custom filter UIs and rich cell content go through scoped slots instead of column callbacks: the filter-{key} slot replaces the default filter input (see Filtering), and the cell-{key} slot renders full custom cell content receiving { item, index } (see Columns overview).

formatter runs on the scroll hot path and its output is used for CSV export; cell-{key} slots are for rich cell content and are never exported. Use one or the other per column.