hoc element table

@hoc-element/table

? table auf Webpack 5, <el-xxx> in Vue 3. Durch das Erreichen eines höheren Freiheitsgrads sollen sich wiederholende Vorgänge reduziert und die Entwicklung effizienter gestaltet werden.

Diese Komponentenbibliothek kann zum Lernen, Nachschlagen und zur sekundären Entwicklung verwendet werden

Live-Demo

Version

• Vue 3.x-Version |. Vue 2.x-Version

Screenshot

Umweltunterstützung

• Vue 3.2.x

Installieren

npm install @hoc-element/table

# or

pnpm add @hoc-element/table

Schnellstart

• Bitte installieren Sie element-plus vor der Verwendung

 import { createApp } from 'vue'
import ElementPlus from 'element-plus'
import HocElTable from '@hoc-element/table'
import App from './App.vue'

createApp ( App )
  . use ( ElementPlus )
  . use ( HocElTable )
  . mount ( '#app' ) 

Änderungsprotokoll

Detaillierte Änderungen für jede Version sind in den Versionshinweisen dokumentiert

Besonderheit

• Basierend auf Webpack 5
• Volle Unterstützung für Vue 3
• Unterstützt die schnelle Konfiguration von JSON serialisierten Tabellen
• Pagination ist integriert
• Unterstützt benutzerdefinierte Spaltennamen prop
• Unterstützt benutzerdefiniertes Rendering von Zelleninhalten [siehe Konfigurationsanweisungen für das Zellen-Rendering]
• Unterstützt benutzerdefinierten style
• Unterstützen Sie verbindliche benutzerdefinierte directives
• Unterstützt die Bindung von Events und Methods der element-plus nativen Table
• Unterstützt die Anzeige- und Verdeckungssteuerung von Header und Pagination

Konfigurationsanweisungen für die Zellendarstellung

Verfahren	veranschaulichen	Szene
---	Rendern Sie den Schlüsselwert, der der attrs.prop der Zelle entspricht	Geeignet für die direkte Anzeige des Prop-Werts
machen	Render-String	Geeignet für Szenarien, in denen eine gewisse Mikroverarbeitung mit dem Standard-Prop-Wert durchgeführt wird.
renderHTML	Rendern Sie das angegebene DOM-Element	Geeignet zum Anzeigen von Aktionen, wird im Allgemeinen in der letzten Spalte verwendet (unterstützt derzeit nur das Rendern von El-Buttons, Einzelheiten finden Sie im Beispiel).
renderComponent	Renderkomponente	Geeignet für Szenarien, in denen komplexe Inhalte in Zellen angezeigt werden müssen. Weitere Informationen finden Sie im Beispiel

Beispiel

Dies ist ein relativ vollständiges Beispiel, das fast alle Verwendungszwecke der API abdeckt. Der Quellcode ist hier: Code

Einsetzen

Siehe Repository ? hoc-element-table-build