Table

useTableColumns

Composable interno per estrarre le definizioni delle colonne dagli slot Column di DataTable.

Composable interno — utilizzato dai componenti DataTable e TreeTable della libreria.

Firma TypeScript

export function useTableColumns<C extends BaseColumnProps = BaseColumnProps>(
  options: UseTableColumnsOptions<C>
): UseTableColumnsResult<C>

export interface UseTableColumnsOptions<C extends BaseColumnProps = BaseColumnProps> {
  slots: Slots;
  normalizeColumn?: (props: Record<string, unknown>) => C;
}

export interface UseTableColumnsResult<C extends BaseColumnProps = BaseColumnProps> {
  columnDefinitions: ComputedRef<ExtractedColumn<C>[]>;
  visibleColumns: ComputedRef<ExtractedColumn<C>[]>;
  sortableColumns: ComputedRef<ExtractedColumn<C>[]>;
  hasColumnSlot: (col: ExtractedColumn<C>, slotName: keyof ColumnSlotFunctions) => boolean;
  getColumnSlotRenderer: <T extends keyof ColumnSlotFunctions>(col: ExtractedColumn<C>, slotName: T) => ColumnSlotFunctions[T] | null;
}

export type ExtractedColumn<C extends BaseColumnProps = BaseColumnProps> = C & {
  /** Slot interni della colonna (body, header, footer, filter, editor) */
  _slots?: ColumnSlotFunctions;
  /** Chiave univoca della colonna nella tabella (sempre valorizzata dal composable) */
  _key?: string;
};

Parametri

Parametro	Tipo	Descrizione
`options.slots`	`Slots`	Slots del componente padre (da `useSlots()`)
`options.normalizeColumn`	`(props) => C` (opzionale)	Funzione per normalizzare le props della colonna

Valore di Ritorno

Proprietà	Tipo	Descrizione
`columnDefinitions`	`ComputedRef<ExtractedColumn<C>[]>`	Tutte le colonne estratte dallo slot default
`visibleColumns`	`ComputedRef<ExtractedColumn<C>[]>`	Solo colonne con `hidden=false`
`sortableColumns`	`ComputedRef<ExtractedColumn<C>[]>`	Solo colonne con `sortable=true`
`hasColumnSlot`	`(col, slotName) => boolean`	Verifica se una colonna ha uno slot specifico (body, header, footer, filter, editor)
`getColumnSlotRenderer`	`(col, slotName) => fn \| null`	Restituisce la funzione render dello slot o null

Esempio

const slots = useSlots()
const { visibleColumns, hasColumnSlot, getColumnSlotRenderer } = useTableColumns({ slots })

// In template
visibleColumns.value.forEach(col => {
  if (hasColumnSlot(col, 'body')) {
    const renderer = getColumnSlotRenderer(col, 'body')
    // renderer({ data: row, field: col.field, index, column: col })
  }
})

Note

L'estrazione avviene ricorsivamente nello slot default cercando VNode con type.name === 'Column' o type.__name === 'Column' (con <script setup> il compilatore valorizza solo __name), oppure, per le colonne "Column-like", con prop field/header. Una Column senza field né header (es. colonna azioni) è quindi riconosciuta.
Ogni colonna estratta riceve _key, univoca nella tabella: columnKey, altrimenti field, altrimenti col-<posizione>; una chiave già usata riceve il suffisso -<posizione>. Va usata come :key e come chiave di qualunque cache per colonna: con field || columnKey le colonne senza entrambi collidevano e prendevano il layout dell'ultima.
Gli attributi booleani in template Vue vengono passati come '' (stringa vuota) invece di true; il composable normalizza automaticamente sortable, hidden, expander.
Gli slot interni della colonna (body, header, ecc.) sono salvati in col._slots come funzioni render.
getColumnSlotRenderer e type-safe: il tipo di ritorno varia in base al slotName passato.

Table

Composables per DataTable — core, colonne, sort, pagination, selezione, filtro, grouping, editing, espansione, persistenza stato.

useTableCore

Composable interno con funzionalita core condivise tra DataTable e TreeTable (accesso nested, row key, classi CSS).