Maximieren Sie Ihre Produktivität mit AG Grid Documentation

Bei AG Grid investieren wir viel Mühe in unsere Dokumentation, da wir verstehen, dass eine gute Dokumentation Entwicklern hilft, ihre Ziele zu erreichen. In diesem Beitrag möchte ich einige Funktionen unserer Dokumentation hervorheben, die Ihre Produktivität erheblich verbessern können.

Wahlrahmen

AG Grid ist ein agnostisches Datengrid, das mit dedizierten Paketen für Angular, React und Vue zusätzlich zum Standard-Javascript/Typescript-Angebot ausgeliefert wird.

Wie Sie sich vorstellen können, hängt die Interaktion mit dem Grid vom verwendeten Framework ab. Als Ergebnis passen wir die Dokumentations-Code-Snippets und Beispiele basierend auf Ihrem Framework an. Zusätzlich fügen wir basierend auf Ihrer Auswahl Framework-spezifische Hinweise zum Textinhalt hinzu.

Aus diesem Grund ist es wichtig, Ihr Framework auszuwählen, um die genaueste Dokumentation für Sie anzuzeigen. Als Beispiel sehen Sie im folgenden Codebeispiel, wie sich die Spaltendefinitionen basierend auf Ihrer Framework-Auswahl ändern.

Javascript / Typoskript

Eckig

Reagieren

Sehen

Frameworkspezifischer Beispielcode

Ein weiteres wichtiges Merkmal unserer Dokumentation ist unsere Verpflichtung, vollständige Codebeispiele für alle Raster-/Diagrammfunktionen bereitzustellen. Damit Sie Code aus unseren Beispielen direkt in Ihre Projekte kopieren können, erstellen wir Beispiele, die in jedem Framework geschrieben sind.

Zum Zeitpunkt der Erstellung dieses Artikels werden alle folgenden Framework-Variationen unterstützt.

  • Javascript / Typoskript
  • Eckig
  • Reagieren - Hooks / Klassen
  • Vue - 2 / 3


Beachten Sie, wie das Beispiel neu geladen wird, wenn Sie die Framework-Variation ändern.

Um den Quellcode für ein Beispiel anzuzeigen, verwenden Sie das Seitenmenü des Beispiel-Runners.

Module vs. Pakete

In einem früheren Beitrag haben wir erläutert, wie Sie Funktionsmodule verwenden, um die Größe Ihres Anwendungspakets zu minimieren. Ein Teil des für diesen Ansatz erforderlichen Codes ist die Registrierung von Funktionsmodulen.

Als Entwickler ist es sehr nützlich zu sehen, welche Funktionsmodule für eine bestimmte Funktion erforderlich sind. Unsere Modulbeispiele tun genau das. Dazu gehört die Registrierung von Funktionsmodulen, damit Sie schnell wissen, welche Module Sie in Ihre Anwendung importieren müssen.

import { ModuleRegistry } from '@ag-grid-community/core';
import { ClientSideRowModelModule } from '@ag-grid-community/client-side-row-model';
import { RangeSelectionModule } from '@ag-grid-enterprise/range-selection';

// Register the required feature modules with the Grid
ModuleRegistry.registerModules([
  ClientSideRowModelModule,
  RangeSelectionModule,
]);

Alternativ, wenn Sie mit packages arbeiten Es ist keine Modulregistrierung erforderlich, sodass wir Ihnen einen kürzeren Code geben können.

Korrigieren Sie die Importpfade

Die Importpfade für Module und Pakete sind unterschiedlich. Um sicherzustellen, dass Sie Code aus unseren Beispielen kopieren können, ohne Änderungen vornehmen zu müssen, verwenden Sie das Format, das mit Ihrer Anwendungskonfiguration übereinstimmt.

Pakete haben Importe wie:

import { ColDef, GridOptions } from 'ag-grid-community';

Module haben Importe wie:

import { ColDef, GridOptions } from '@ag-grid-community/core';

Experimentieren Sie mit Plunker

Für jedes Beispiel können Sie auf die Schaltfläche In Plunker öffnen klicken und das Beispiel wird automatisch in Plunker geöffnet, bereit für Sie zum Optimieren und Experimentieren. Auf diese Weise können Sie eine Funktion praktisch ausprobieren, ohne Zeit für die Einrichtung einer Entwicklungsumgebung aufwenden zu müssen.

In Kürze in unserer nächsten Version werden Typescript- und Angular-Beispiele Tippfehler und automatische Vervollständigung in Plunker enthalten, was das Experimentieren noch einfacher macht!

Ihre Einstellungen werden gespeichert

Sobald Sie ein Framework und eine Beispielvariante ausgewählt haben, merken wir uns diese, sodass Sie diese Einstellungen nicht ständig aktualisieren müssen, wenn Sie durch die Dokumente navigieren. Wir hoffen, dass Sie dadurch so produktiv wie möglich sind und es Ihnen leicht machen, Code aus unseren Beispielen zu übernehmen und ihn nahtlos in Ihre Anwendungen zu integrieren.

Frühere Versionen von AG Grid

Wenn Sie nicht in der Lage sind, die neueste Version von AG Grid zu verwenden, sollten Sie wissen, dass Sie die gesamte Dokumentationsseite wie in früheren Versionen über unser Archiv anzeigen können. Allerdings würde ich das nur empfehlen, wenn Sie Inkonsistenzen mit der neuesten Version finden.

Fazit

Ich hoffe, dass diese Hinweise Ihnen helfen werden, Ihre Produktivität bei der Verwendung unserer Dokumentation zu verbessern und Ihnen ermöglichen, großartige Anwendungen mit AG Grid zu erstellen! Lassen Sie uns wie immer im Kommentarbereich wissen, ob Sie als Benutzer irgendwelche Ideen haben, um die Dokumentation noch besser zu machen!