Kabelgebundene Elemente als Reaktionskomponenten.
Die Storybook -Demo enthält interaktive Beispiele sowie detaillierte Dokumentation für die Requisiten und die Verwendung der einzelnen Komponenten.
Wired Elements ist eine wirklich coole Bibliothek, die Webkomponenten mit SVGs mit einem Drahtrahmen -Look bietet. Diese Bibliothek wickelt jedes der verkabelten Elemente in einer React -Komponente ein und enthält die verfügbaren Attribute, Methoden und Styling -Optionen als Requisiten (so gut wie möglich).
Schritt 1. Installieren Sie diese Bibliothek mit yarn oder npm .
yarn add react-wired-elements
Schritt 2. Fügen Sie die CSS -Datei der Materialikons in den Kopf Ihrer Haupt -HTML -Datei hinzu.
< head >
< link
href =" https://fonts.googleapis.com/css?family=Material+Icons&display=block "
rel =" stylesheet "
/>
</ head > import React from 'react' ;
import { WiredCard , WiredButton } from 'react-wired-elements' ;
const App = ( ) => {
return (
< WiredCard fill = "#F5F5F5" elevation = { 3 } >
< WiredButton onClick = { handleSubmit } > Submit </ WiredButton >
</ WiredCard >
) ;
} ;Schauen Sie sich die Storybook -Demo für interaktive Beispiele und detaillierte Requisitendefinitionen und Verwendungsanweisungen an.
Hier ist die vollständige Liste der Komponenten. Klicken Sie auf eine beliebige Komponente, um an das Beispielbuch -Beispiel zu richten.
Es gibt einige Namens- und Funktionsunterschiede zwischen kabelgebundenen Elementen und dieser Bibliothek. Dies ist teilweise auf Unterschiede in Bezug auf die Funktionsweise von Reaktionen und Webkomponenten sowie auf die Bemühungen zurückzuführen, gemeinsame Namenskonventionen/-muster in React zu befolgen. Da es sich um Webkomponenten handelt, senden sie native Ereignisse im Gegensatz zu reagierten synthetischen Ereignissen.
maxRows Requisite für WiredTextArea -Komponente funktioniert nichtfirstDate und lastDate arbeiten nicht an WiredCalendar