Inhaltsverzeichnis
Table-Klasse
Vue Tables-2
Ag Grid Vue
Vue Easytable
Vue Good Table
Vue Notifications
Vue Awesome Notifications
Vue Wait
Vue Content Loader
Epic Spinners
Vue Radial Progress
ICONS
Vue Feather Icons
Funktionen
Vue Awesome
Vue Material Design Icons
Charts
Vue Apexccharts
Vue Echarts
Vue Chartjs
V-Charts
Zeit
Vue Timer Hook
Vue Horizontal Timeline:
Heim Web-Frontend View.js [Hematemesis-Zusammenfassung] Über 20 nützliche Vue-Komponentenbibliotheken, kommen Sie und holen Sie sie ab!

[Hematemesis-Zusammenfassung] Über 20 nützliche Vue-Komponentenbibliotheken, kommen Sie und holen Sie sie ab!

Mar 30, 2022 pm 08:36 PM
vue 组件库

Dieser Artikel fasst mehr als 20 nützliche Vue-Komponentenbibliotheken zusammen, die Entwicklern helfen können, die Entwicklungseffizienz und -ästhetik zu verbessern. Ich hoffe, dass er für alle hilfreich ist!

[Hematemesis-Zusammenfassung] Über 20 nützliche Vue-Komponentenbibliotheken, kommen Sie und holen Sie sie ab!

In diesem Artikel werden wir einige der häufigsten Vue-JS-Komponenten untersuchen. Sie können es abholen.

Table-Klasse

Vue Tables-2

[Hematemesis-Zusammenfassung] Über 20 nützliche Vue-Komponentenbibliotheken, kommen Sie und holen Sie sie ab!

Adresse: https://github.com/matfish2/vue-tables-2

Vue Tables 2 zielt darauf ab, Entwicklern eine voll funktionsfähige A Toolset zum Erstellen schöner und praktischer Datentabellen mit Vue. Hunderte von Unternehmenssoftwareanwendungen nutzen es. Darüber hinaus wird Vue Tables 2 ständig erweitert, verbessert und erhält neue Funktionen.

Funktionen

  • Optionale Zeilen und Sticky-Header
  • Virtuelles Paging
  • CSV-Download von Kundenkomponentendaten
  • Mehrstufige Gruppierung mit Datenschichtunterstützung
  • Tailwind-Theme

Handsontable

[Hematemesis-Zusammenfassung] Über 20 nützliche Vue-Komponentenbibliotheken, kommen Sie und holen Sie sie ab!

Adresse: https://github.com/handsontable/handsontable/tree/master/wrappers/vue

handsontable ist ein interaktives Plug-In für seitenseitige Tabellen, das Tabelleninhalte laden und anzeigen kann und zusammengeführte Elemente und Statistiken unterstützen kann , Zeilen- und Spaltenziehen usw.

Gleichzeitig unterstützt es die Verarbeitung geladener Tabellenseiten: Hinzufügen/Löschen von Zeilen/Spalten, Zusammenführen von Zellen usw.

Außerdem funktioniert es mit React, Angular und Vue. Handsontable ist eine JavaScript-Komponente, die Datenrasterfunktionen mit der Benutzererfahrung einer Tabellenkalkulation kombiniert. Darüber hinaus bietet es Datenbindung, Datenvalidierung, Filterung, Sortierung und CRUD-Operationen.

Funktionen

  • Mehrspaltige Sortierung
  • Nicht zusammenhängende Auswahl
  • Daten filtern und Daten validieren
  • Datei exportieren
  • Bedingte Formatierung
  • Zellen zusammenführen
  • Zeilen/Spalten ausblenden ähm
  • Kontextmenü und Kommentare

Ag Grid Vue

[Hematemesis-Zusammenfassung] Über 20 nützliche Vue-Komponentenbibliotheken, kommen Sie und holen Sie sie ab!

Adresse: https://github.com/ag-grid/ag-grid

Ag-Grid ist eine Datentabellenkomponente basierend auf Vue.js. Unter ihnen bedeutet „ag“ „Agnostiker“. Die interne ag-Grid-Engine ist in TypeScript ohne Abhängigkeiten implementiert.

ag-Grid unterstützt Vue über eine Wrapper-Komponente. Sie können ag-Grid wie jede andere Vue-Komponente in Ihrer Anwendung verwenden. Es unterstützt die Weitergabe der Konfiguration durch Eigenschaftsbindung und die Verarbeitung von Ereignissen durch Ereignisbindung. Sie können sogar Vue-Komponenten verwenden, um die Raster-Benutzeroberfläche und den Inhalt/das Verhalten von Zellen anzupassen.

Vue Easytable

[Hematemesis-Zusammenfassung] Über 20 nützliche Vue-Komponentenbibliotheken, kommen Sie und holen Sie sie ab!

Adresse: https://github.com/huangshuwei/vue-easytable

vue-easytable ist eine der leistungsstärksten Vue-Tabellenkomponenten, die mir je begegnet sind.

Die Tabellenkomponente verfügt über viele integrierte Funktionen, wie z. B. Zellenauslassungspunkte, feste/flexible Spaltengröße, benutzerdefinierte Filterung und mehr. Es verfügt über mehrere Funktionen:

  • Internationalisierung
  • Theme-Anpassung
  • Eingebautes Theme
  • Virtuelles Scrollen
  • Spalte korrigiert
  • Header korrigiert
  • Header-Gruppierung

Vue Good Table

[Hematemesis-Zusammenfassung] Über 20 nützliche Vue-Komponentenbibliotheken, kommen Sie und holen Sie sie ab!

Adresse: https://github.com/xaksis/vue-good-table

Vue-Good-Table ist eine Datentabellenkomponente, die auf Vue.js basiert. Sie ist einfach und sauber und verfügt über grundlegendere Funktionen wie Sortieren und Spaltenfiltern , Paging usw. Funktion. Es hat mehrere Eigenschaften: 索 Tabellensuche und -sortierung

    Filtern und Paginieren
  • Kontrollkästchentabelle
  • Linienstil
  • Mehrfachauswahl
  • Vue Toastification

Adresse: https://github.com /Maronato/vue-toastification

Es bietet leichte, einfache und schöne Toasttipps. Es verfügt über eine integrierte Nuxt-Unterstützung. Darüber hinaus unterstützt es die neue Composition API und Vue 3. Wir können SX auch verwenden, um benutzerdefinierte Komponenten zu entwickeln, um flexiblere Funktionen bereitzustellen. Darüber hinaus ermöglicht die universelle Registrierung die Verwendung in jeder Anwendung, sogar in React. Es verfügt über mehrere Funktionen: [Hematemesis-Zusammenfassung] Über 20 nützliche Vue-Komponentenbibliotheken, kommen Sie und holen Sie sie ab!

Komplett in Typescript geschrieben, unterstützt alle Typen

Unterstützt RTL

    Alles anpassen
  • Zum Schließen schieben
  • Benutzerdefinierte Erlebnisse mit onClose, onClick und onMounted Hooks erstellen
  • Toast programmgesteuert löschen und aktualisieren
  • Vue Toasted
Adresse: https://github.com/shakee93/vue-toasted

[Hematemesis-Zusammenfassung] Über 20 nützliche Vue-Komponentenbibliotheken, kommen Sie und holen Sie sie ab!

Vue Toasted ist eines der besten Toast-Plugins für Vue. Viele Organisationen wie Vue, Laravel, NuxtJS usw. vertrauen darauf. Es reagiert sehr gut, ist gut kompatibel, einfach zu verwenden, attraktiv und verfügt über umfangreiche Funktionen, Symbole, Aktionen usw.

Vue Notifications

[Hematemesis-Zusammenfassung] Über 20 nützliche Vue-Komponentenbibliotheken, kommen Sie und holen Sie sie ab!

Adresse: https://github.com/se-panfilov/vue-notifications

Vue Notifications ist eine bibliotheksunabhängige, nicht blockierende Benachrichtigungskomponente.

VueNotiments verbindet Ihre App mit der Benachrichtigungs-UI-Bibliothek. Unterstützt miniToastr, VueToasted, VueEasyToast, toastr, iziToast, Noty, swal.

Vue Awesome Notifications

[Hematemesis-Zusammenfassung] Über 20 nützliche Vue-Komponentenbibliotheken, kommen Sie und holen Sie sie ab!

Adresse: https://f3oall.github.io/awesome-notifications/

Awesome Notifications ist ein leichtes, vollständig anpassbares JavaScript von Vue Awesome Notifications, es ist die Vue.js-Version der Awesome Notifications-Bibliothek.

Vue Wait

[Hematemesis-Zusammenfassung] Über 20 nützliche Vue-Komponentenbibliotheken, kommen Sie und holen Sie sie ab!

Adresse: https://github.com/f/vue-wait

Vue Wait Dies ist eine komplexe Lade- und Fortschrittsverwaltungskomponente für VUE-, Vuex- und Nuxt-Anwendungen.

Vue Wait hilft dabei, mehrere Ladezustände auf der Seite zu verwalten, ohne dass es zu Konflikten zwischen den Zuständen kommt. Basierend auf einer sehr einfachen Idee: Indem Sie ein Array (oder einen Vuex-Speicher) mit mehreren Ladezuständen verwalten, lassen Sie die integrierte Laderkomponente auf registrierte Lader warten und geben Sie den Ladezustand sofort ein.

Vue Content Loader

Adresse: https://github.com/egoist/vue-content-loader

1[Hematemesis-Zusammenfassung] Über 20 nützliche Vue-Komponentenbibliotheken, kommen Sie und holen Sie sie ab!

Vue Content Loader ist ein Vue.js-basierter SVG-Platzhalter zum Laden, der als SVG-Komponente angepasst werden kann zum Erstellen von Platzhalter-Ladevorgängen, z. B. Facebook-Ladekarten. Vue Content Loader ist die Vue-Implementierung von React-Content-Loader.

  • Vollständig anpassbar: Sie können Farbe, Geschwindigkeit und Größe ändern.

  • Erstellen Sie Ihr eigenes Loadout: Erstellen Sie ganz einfach Ihr individuelles Loadout mit Online-Tools.

  • Sie können es jetzt verwenden: Es gibt bereits viele vorgefertigte Sets nach oben

  • Leistung

Epic Spinners

1[Hematemesis-Zusammenfassung] Über 20 nützliche Vue-Komponentenbibliotheken, kommen Sie und holen Sie sie ab!

Adresse: https://epic-spinners.epicmax.co/

EpicSpinners ist eine Reihe benutzerfreundlicher Web-Loading-Effekte, die von erstellt wurden reines CSS, und es integriert auch Vue-Komponenten, die problemlos in Vue-Projekten verwendet werden können. Da es mit reinem CSS erstellt wurde, können Sie es in jedes Webprojekt integrieren und verwenden!

Vue Radial Progress

1[Hematemesis-Zusammenfassung] Über 20 nützliche Vue-Komponentenbibliotheken, kommen Sie und holen Sie sie ab!

Adresse: https://github.com/wyzant-dev/vue-radial-progress

Vue Radial Progress Dies ist eine Ladekomponente für den radialen Fortschrittsbalkeneffekt unter Verwendung von SVG und JavaScript zeichnen einen Loader mit einem radialen Fortschrittsbalkeneffekt mit Farbverlauf, der als Lade- und Fortschrittsaufforderung verwendet werden kann.

ICONS

Vue Feather Icons

Adresse: https://github.com/egoist/vue-feather-icons

1[Hematemesis-Zusammenfassung] Über 20 nützliche Vue-Komponentenbibliotheken, kommen Sie und holen Sie sie ab!

Feather ist eine Reihe von Open-Source-Icon-Bibliotheken für Designer und Entwickler und schöne Open-Source-Icon-Bibliothek. Jedes Symbol ist in einem 24×24-Raster gestaltet und legt Wert auf Einfachheit, Konsistenz und Lesbarkeit. Viele von großen Herstellern hergestellte Frontend-Frameworks verfügen über integrierte Symbole, die für die kommerzielle Nutzung kostenlos sind.

Funktionen

  • Jedes Symbol ist nach einheitlichen Standards gestaltet und verfügt über eine perfekte Pixelausrichtung.
  • Der Designstil ist konsistent, was diese Patchwork-Symbolbibliotheken übertrifft.
  • Unterstützung für eine Vielzahl von Entwicklungsszenarien. Sehr freundlich.

Vue Awesome

Adresse: https://github.com/Justineo/vue-awesome

1[Hematemesis-Zusammenfassung] Über 20 nützliche Vue-Komponentenbibliotheken, kommen Sie und holen Sie sie ab!

Font Awesome ist eine Reihe beliebter Symbolschriftbibliotheken, auf die wir während des eigentlichen Entwicklungsprozesses häufig stoßen. Wenn es um Szenarien geht, in denen Symbole benötigt werden, können wir einige häufig verwendete Symbole direkt in Font Awesome finden und verwenden, ohne dass ein Designer erforderlich ist. Persönlich finde ich, dass die Symbole von Font Awesome ziemlich vollständig sind. Es enthält die meisten Symbole und unterstützt verschiedene Frameworks.

Vue Material Design Icons

Adresse: https://github.com/robcresswell/vue-material-design-icons

Eine Sammlung von SVG Material Design Icons als Einzeldateikomponenten. Darüber hinaus handelt es sich bei dieser Bibliothek um eine Sammlung von Vue-Einzeldateikomponenten zum Rendern von Material Design-Symbolen. Darüber hinaus enthält es etwas CSS, um die Skalierung des Symbols etwas zu vereinfachen.

Charts

Vue Apexccharts

Adresse: https://github.com/apexcharts/vue-apexcharts

1[Hematemesis-Zusammenfassung] Über 20 nützliche Vue-Komponentenbibliotheken, kommen Sie und holen Sie sie ab!

Apexcharts ist eine moderne JavaScript-Diagrammbibliothek/erstellt interaktiv mit einer einfachen API Diagramme und Visualisierungen . Vue Apexcharts ist eine Vue.js-Komponente von ApexCharts.

Vue Echarts

Adresse: https://github.com/Justineo/vue-echarts

1[Hematemesis-Zusammenfassung] Über 20 nützliche Vue-Komponentenbibliotheken, kommen Sie und holen Sie sie ab!

vue-echarts ist eine Komponentenbibliothek, die auf der Echarts-Kapselung basiert. Sie kann wie gewohnt direkt installiert werden Komponenten-Referenzmethode. Für spezifische Installations- und Zitierhinweise können Leser direkt die technische Dokumentation von vue-echarts lesen.

Vue Chartjs

Adresse: https://github.com/apertureless/vue-chartjs

1[Hematemesis-Zusammenfassung] Über 20 nützliche Vue-Komponentenbibliotheken, kommen Sie und holen Sie sie ab!

vue-chartjs ist ein Vue-Paket für Chart.js, das Benutzern die einfache Verwendung von Chart in Vue .js ermöglicht , wodurch es einfach ist, wiederverwendbare Diagrammkomponenten zu erstellen, ideal für Leute, die einfache Diagramme benötigen, die so schnell wie möglich ausgeführt werden. vue-chartjs abstrahiert die grundlegende Logik und macht auch Chart.js-Objekte verfügbar, sodass Benutzer maximale Flexibilität erhalten.

V-Charts

Adresse: https://github.com/ElemeFE/v-charts

1[Hematemesis-Zusammenfassung] Über 20 nützliche Vue-Komponentenbibliotheken, kommen Sie und holen Sie sie ab!

V-Charts ist eine Symbolkomponente, die auf Vue2.0 und Echarts basiert und nur einen Typ benötigt einheitlich bereitzustellen Gemeinsame Diagramme können generiert werden, indem einfache Konfigurationselemente in einem Datenformat festgelegt werden, das sowohl für das Front-End als auch für das Back-End geeignet ist.

Zeit

Vue Timer Hook

Adresse: https://github.com/riderx/vue-timer-hook

[Hematemesis-Zusammenfassung] Über 20 nützliche Vue-Komponentenbibliotheken, kommen Sie und holen Sie sie ab!

Das Vue3-Timermodul ist vom React-Timer-Hook inspiriert. Darüber hinaus handelt es sich um einen benutzerdefinierten Hook zur Handhabung von Timern, Stoppuhren und Zeitlogik/-status in Vue 3-Komponenten.

Vue Horizontal Timeline:

Adresse: https://github.com/guastallaigor/vue-horizontal-timeline

2[Hematemesis-Zusammenfassung] Über 20 nützliche Vue-Komponentenbibliotheken, kommen Sie und holen Sie sie ab!

Vue Horizontal Timeline ist eine einfache horizontale Timeline-Komponente, die mit Vue.js erstellt wurde.

Ursprüngliche Adresse: https://medium.com/js-dojo/20-usefulue-js-components-2022-3bf9fbe5b556

Autor: lindelof

(Teilen von Lernvideos: vuejs-Tutorial, Webseite -Ende )

Das obige ist der detaillierte Inhalt von[Hematemesis-Zusammenfassung] Über 20 nützliche Vue-Komponentenbibliotheken, kommen Sie und holen Sie sie ab!. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

AI Hentai Generator

AI Hentai Generator

Erstellen Sie kostenlos Ai Hentai.

Heißer Artikel

R.E.P.O. Energiekristalle erklärten und was sie tun (gelber Kristall)
2 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
Repo: Wie man Teamkollegen wiederbelebt
1 Monate vor By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Abenteuer: Wie man riesige Samen bekommt
4 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

So verwenden Sie Echarts in Vue So verwenden Sie Echarts in Vue May 09, 2024 pm 04:24 PM

Durch die Verwendung von ECharts in Vue können Sie Ihrer Anwendung ganz einfach Datenvisualisierungsfunktionen hinzufügen. Zu den spezifischen Schritten gehören: Installieren von ECharts- und Vue ECharts-Paketen, Einführung von ECharts, Erstellen von Diagrammkomponenten, Konfigurieren von Optionen, Verwenden von Diagrammkomponenten, Anpassen von Diagrammen an Vue-Daten, Hinzufügen interaktiver Funktionen und Verwenden erweiterter Verwendungsmöglichkeiten.

Die Rolle des Exportstandards in Vue Die Rolle des Exportstandards in Vue May 09, 2024 pm 06:48 PM

Frage: Welche Rolle spielt der Exportstandard in Vue? Detaillierte Beschreibung: Exportstandard definiert den Standardexport der Komponente. Beim Importieren werden Komponenten automatisch importiert. Vereinfachen Sie den Importvorgang, verbessern Sie die Übersichtlichkeit und vermeiden Sie Konflikte. Wird häufig zum Exportieren einzelner Komponenten verwendet, wobei sowohl benannte als auch Standardexporte verwendet werden und globale Komponenten registriert werden.

So verwenden Sie die Kartenfunktion in Vue So verwenden Sie die Kartenfunktion in Vue May 09, 2024 pm 06:54 PM

Die Kartenfunktion von Vue.js ist eine integrierte Funktion höherer Ordnung, die ein neues Array erstellt, wobei jedes Element das transformierte Ergebnis jedes Elements im ursprünglichen Array ist. Die Syntax lautet map(callbackFn), wobei callbackFn jedes Element im Array als erstes Argument empfängt, optional den Index als zweites Argument, und einen Wert zurückgibt. Die Kartenfunktion ändert das ursprüngliche Array nicht.

Der Unterschied zwischen Event und $event in Vue Der Unterschied zwischen Event und $event in Vue May 08, 2024 pm 04:42 PM

In Vue.js ist event ein natives JavaScript-Ereignis, das vom Browser ausgelöst wird, während $event ein Vue-spezifisches abstraktes Ereignisobjekt ist, das in Vue-Komponenten verwendet wird. Im Allgemeinen ist die Verwendung von $event bequemer, da es so formatiert und erweitert ist, dass es die Datenbindung unterstützt. Verwenden Sie „event“, wenn Sie auf bestimmte Funktionen des nativen Ereignisobjekts zugreifen müssen.

Die Rolle von Onmount in Vue Die Rolle von Onmount in Vue May 09, 2024 pm 02:51 PM

onMounted ist ein Lebenszyklus-Hook für die Komponentenmontage in Vue. Seine Funktion besteht darin, Initialisierungsvorgänge durchzuführen, nachdem die Komponente im DOM bereitgestellt wurde, z. B. das Abrufen von Referenzen auf DOM-Elemente, das Festlegen von Daten, das Senden von HTTP-Anforderungen, das Registrieren von Ereignis-Listenern usw. Es wird nur einmal aufgerufen, wenn die Komponente gemountet wird. Wenn Sie Vorgänge ausführen müssen, nachdem die Komponente aktualisiert wurde oder bevor sie zerstört wurde, können Sie andere Lebenszyklus-Hooks verwenden.

Der Unterschied zwischen Export und Exportstandard in Vue Der Unterschied zwischen Export und Exportstandard in Vue May 08, 2024 pm 05:27 PM

Es gibt zwei Möglichkeiten, Module in Vue.js zu exportieren: Export und Export Default. export wird zum Exportieren benannter Entitäten verwendet und erfordert die Verwendung von geschweiften Klammern; export default wird zum Exportieren von Standardentitäten verwendet und erfordert keine geschweiften Klammern. Beim Importieren müssen per Export exportierte Entitäten ihre Namen verwenden, während per Exportstandard exportierte Entitäten implizit verwendet werden können. Es wird empfohlen, die Export-Standardeinstellung für Module zu verwenden, die mehrmals importiert werden müssen, und die Export-Standardeinstellung für Module, die nur einmal exportiert werden müssen.

Was sind Hooks in Vue Was sind Hooks in Vue May 09, 2024 pm 06:33 PM

Vue-Hooks sind Rückruffunktionen, die Aktionen bei bestimmten Ereignissen oder Lebenszyklusphasen ausführen. Dazu gehören Lebenszyklus-Hooks (wie beforeCreate, mount, beforeDestroy), Event-Handling-Hooks (wie click, input, keydown) und benutzerdefinierte Hooks. Hooks verbessern die Komponentenkontrolle, reagieren auf Komponentenlebenszyklen, verarbeiten Benutzerinteraktionen und verbessern die Wiederverwendbarkeit von Komponenten. Um Hooks zu verwenden, definieren Sie einfach die Hook-Funktion, führen Sie die Logik aus und geben Sie einen optionalen Wert zurück.

Für welche Szenarien können Ereignismodifikatoren in Vue verwendet werden? Für welche Szenarien können Ereignismodifikatoren in Vue verwendet werden? May 09, 2024 pm 02:33 PM

Vue.js-Ereignismodifikatoren werden verwendet, um bestimmte Verhaltensweisen hinzuzufügen, darunter: Verhindern von Standardverhalten (.prevent), Stoppen von Ereignisblasen (.stop), Einmaliges Ereignis (.once), Erfassen von Ereignissen (.capture), Passives Abhören von Ereignissen (.passive), Adaptiv Modifikator (.self)Schlüsselmodifikator (.key)

See all articles