Qwik Tabelle

Der @tanstack/qwik-table Adapter ist ein Wrapper um die Kern-Tabellenlogik. Die meiste seiner Arbeit bezieht sich auf die Verwaltung des Zustands auf die "qwik"-Art, die Bereitstellung von Typen und die Rendering-Implementierung von Zell-/Header-/Footer-Vorlagen.

Exporte

Der @tanstack/qwik-table re-exportiert alle APIs von @tanstack/table-core und die folgenden

useQwikTable

Nimmt ein options-Objekt entgegen und gibt eine Tabelle von einem Qwik Store mit NoSerialize zurück.

import { useQwikTable } from '@tanstack/qwik-table'

const table = useQwikTable(options)
// ...render your table

import { useQwikTable } from '@tanstack/qwik-table'

const table = useQwikTable(options)
// ...render your table

flexRender

Eine Hilfsfunktion zum Rendern von Zell-/Header-/Footer-Vorlagen mit dynamischen Werten.

Beispiel

jsx

import { flexRender } from '@tanstack/qwik-table'
//...
return (
  <tbody>
    {table.getRowModel().rows.map(row => {
      return (
        <tr key={row.id}>
          {row.getVisibleCells().map(cell => (
            <td key={cell.id}>
              {flexRender(cell.column.columnDef.cell, cell.getContext())}
            </td>
          ))}
        </tr>
      )
    })}
  </tbody>
);

import { flexRender } from '@tanstack/qwik-table'
//...
return (
  <tbody>
    {table.getRowModel().rows.map(row => {
      return (
        <tr key={row.id}>
          {row.getVisibleCells().map(cell => (
            <td key={cell.id}>
              {flexRender(cell.column.columnDef.cell, cell.getContext())}
            </td>
          ))}
        </tr>
      )
    })}
  </tbody>
);

Exporte

useQwikTable

flexRender

Bytes abonnieren

Bytes abonnieren