10 beste Datentabellen-/Grid-Komponenten für Vue.js

Blog

10 beste Datentabellen-/Grid-Komponenten für Vue.js

Übersichtliche Ansicht

Vue-Tabellenkomponenten, Unterstützung für die Zellenbearbeitung, mehrere Köpfe fixiert, mehrspaltig fixiert, Spaltenziehen, Sortieren, bedingter Filter, benutzerdefinierte Spalte



Merkmale



kann Videoanrufe führen
  • Adaptiv, Sie können sich automatisch an die Änderungen des Browserfensters anpassen
  • Spalte fixiert, Überschrift fixiert
  • Stützen Sie das Ziehen der Spaltenbreite
  • Unterstützt Einzelfeldsortierung und Mehrfachfeldsortierung
  • Benutzerdefinierte Spalten, benutzerdefinierte Zellenstile
  • Ladeeffekte, benutzerdefiniertes Laden usw.
  • Eigene Paging-Komponente
  • Zellenbearbeitung
  • Zellenzusammenführung unterstützen (colSpan und rowSpan)
  • Auswahl von Checkboxen unterstützen
  • Fußzeilenzusammenfassung
  • Bedingter Filter

Auf GitHub ansehen

Vuetable 2

Datentabelle vereinfachen! – Datentabellenkomponente für Vue 2.x. Siehe Dokumentation unter https://vuetable.com



Merkmale

  • Arbeiten Sie mit Daten vom API-Endpont oder einem vorhandenen Datenarray/Objekt
  • Definieren Sie Felder, um Ihre JSON-Datenstruktur für die Anzeige abzubilden
  • Passen Sie Ihre Felddatenanzeige bei Bedarf mit einem Formatierer an
  • Erweiterte Feldanpassungen können über Scoped Slot und Field Component vorgenommen werden
  • Einzelsortierung oder Mehrfachsortierung, wenn Ihre API unterstützt wird
  • Paginierungskomponenten enthalten, austauschbar und erweiterbar, oder schreiben Sie Ihre eigenen
  • Optionale Detailzeile zum Anzeigen zusätzlicher Daten für jede Zeile
  • Anpassbar an jedes CSS-Framework, wenn es HTML-Tabellen unterstützt.
  • Und vieles mehr!

Auf GitHub ansehen

Gute Tabellenansicht

Eine benutzerfreundliche, leistungsstarke Datentabelle für Vuejs mit erweiterten Anpassungen, einschließlich Sortierung, Spaltenfilterung, Paginierung, Gruppierung usw. https://xaksis.github.io/vue-good-table/

Merkmale

  • Tabellensuche
  • Sortierung
  • Spaltenfilterung
  • Seitennummerierung
  • Sehr anpassbar
  • Checkbox-Tabelle
  • Tabelle mit gruppierten Zeilen
  • Serverbetriebener Tisch
  • Anpassbarer Stil und Themen

Auf GitHub ansehen

Tabellen anzeigen 2

Vue.js 2-Grid-Komponenten https://matanya.gitbook.io/vue-tables-2/

Premium-Funktionen

  • Sticky Header
  • Gruppierung auf mehreren Ebenen mit Datenschichtunterstützung
  • Thema Rückenwind
  • Fehlernachricht anfordern
  • Virtuelle Paginierung
  • Wählbare Zeilen
  • Axios: Ausstehende Anfragen automatisch abbrechen, wenn eine neue Anfrage gesendet wird
  • Serverseitig: Zähler ziehen, um nur die letzte Anfrage zu rendern
  • Fühlen Sie sich frei, weitere Premium-Funktionen vorzuschlagen, und ich werde in Betracht ziehen, sie hinzuzufügen

Auf GitHub ansehen

Dynamische Tabellenansicht

Eine dynamische Tabelle mit Sortieren, Filtern, Bearbeiten, Paginieren, Mehrfachauswahl usw. https://theoxiong.github.io/vue-table-dynamic/

vue-table-dynamic ist eine vue-Komponente von dynamic table. Es ist darauf ausgelegt, in Echtzeit auf Datenänderungen zu reagieren und orientiert sich an der Laufzeit.

Flatter Visual Studio Code

Merkmale

  • Mehrfachauswahl
  • Suche
  • Sortieren
  • Filter
  • Seitennummerierung
  • Bearbeiten
  • Grenze
  • Streifen
  • Markieren
  • Spaltenbreite
  • Kopfzeile konfigurieren
  • Fester Header
  • Feste Spalten

Auf GitHub ansehen

Nettodatentabellen-Ansicht

JQuery-Ansicht DataTables.net Wrapper-Komponente https://niiknow.github.io/vue-datatables-net/

Diese Bibliothek ist ein Vue 2-Wrapper für jQuery DataTables. Es ist eine winzige Hülle, die nichts enthält, nicht einmal die datatables.net Kernbibliothek.

Auf GitHub ansehen

Essenstabelle

Die App lädt Daten von products.json. Die Komponente ProductTable erhält diese Daten als Requisite. Beim Laden von Daten kann ein Fehler auftreten. Sie können Daten aus der Tabelle löschen und beim Löschen können auch Fehler auftreten. Die App verwendet Vue + Vuex + Vuetify.

Auf GitHub ansehen

Prot-Tabelle

Eine anpassbare Tabellenkomponente in vue. Zur Verwendung als Web-Komponente oder als Komponente in Vue-Projekten vorgesehen.

Auf GitHub ansehen

V Datentabellenlicht

Eine leichte, einfache und einfache Datentabelle für Vue.

Merkmale

  • Leicht
  • Stellen Sie eine Paginierungskomponente bereit
  • Stellen Sie eine Elemente-pro-Seite-Komponente bereit
  • Verlass dich nicht
  • Ereignisgesteuert (alle Ereignisse werden an Sie gesendet und Sie entscheiden, wie Sie darauf reagieren)
  • CSS flexibel (es ist möglich, Klassen zu fast allen generierten Elementen hinzuzufügen)
  • Nach Ereignissen ordnen
  • Header-Möglichkeit beheben
  • Benutzerdefinierte Spalten
  • Benutzerdefinierte Kopfzeilen
  • Zeilenauswahl

Auf GitHub ansehen

#vue #vuejs #javascript #vue-js