Skip to main content

Descripción general

El núcleo de TanStack Table es independiente del framework, lo que significa que su API es la misma independientemente del framework que estés utilizando. Se proporcionan adaptadores para facilitar el trabajo con el núcleo de la tabla según tu framework. Consulta el menú de Adaptadores para ver los adaptadores disponibles.

Typescript​

Aunque TanStack Table está escrito en TypeScript, usar TypeScript en tu aplicación es opcional (pero recomendado, ya que ofrece beneficios excepcionales tanto para ti como para tu base de código)

Sin interfaz gráfica​

Como se mencionó extensamente en la sección Introducción, TanStack Table es sin interfaz gráfica. Esto significa que no renderiza ningún elemento DOM, y en su lugar, se basa en ti, el desarrollador UI/UX, para proporcionar el marcado y los estilos de la tabla. ¡Esta es una excelente manera de construir una tabla que puede ser utilizada en cualquier framework de UI, incluyendo React, Vue, Solid, Svelte, Qwik, e incluso plataformas JS-a-nativas como React Native!

Objetos y Tipos Principales​

El núcleo de la tabla utiliza las siguientes abstracciones, comúnmente expuestas por los adaptadores:

  • Column Defs
    • Objetos utilizados para configurar una columna y su modelo de datos, plantillas de visualización y más
  • Table
    • El objeto principal de la tabla que contiene tanto el estado como la API
  • Table Data
    • El array de datos principal que proporcionas a la tabla
  • Columns
    • Cada columna refleja su respectiva definición de columna y también proporciona APIs específicas de la columna
  • Rows
    • Cada fila refleja sus datos de fila respectivos y proporciona APIs específicas de la fila
  • Header Groups
    • Los grupos de encabezados son segmentos computados de niveles de encabezado anidados, cada uno conteniendo un grupo de encabezados
  • Headers
    • Cada encabezado está directamente asociado o se deriva de su definición de columna y proporciona APIs específicas del encabezado
  • Cells
    • Cada celda refleja su intersección respectiva de fila-columna y proporciona APIs específicas de la celda

Existen aún más estructuras que pertenecen a características específicas como filtrado, ordenación, agrupación, etc., las cuales puedes encontrar en la sección de características.