redux autoform

Haftungsausschluss der Beta -Version

redux-autoform wird aktiv entwickelt. APIs wird sich ändern und die Dinge können immer noch nicht wie erwartet funktionieren. Wenn Sie ein Problem finden, melden Sie es bitte. Wir werden mein Bestes tun, um es zu beheben.

• Einführung
• Unterstützte UI -Frameworks
• Demos
• Dokumente
• Installation
• Verwendung
• Lokalisierung
• Stile
• Aufbau und Laufen der Demo vor Ort
• Die Tests ausführen
• Beitragen
• Lizenz

Einführung

Redux-Autoform ist eine agnostische UI-Bibliothek zur dynamischen Erzeugung von Redux-Form aus Metadaten.

Unterstützte UI -Frameworks

• Bootstrap (Beta -Staat)
• Material-UI (Beta-Staat)

Demos

• Bootstrap -Demo.
• Material-UI-Demo.

Dokumente

Dokumente sind hier verfügbar.

Installation

 npm install redux-autoform

Verwendung

Autoform (Quelle)

Die Hauptreaktionskomponente.

 import { AutoForm } from 'redux-autoform' ;

Die AutoForm -Requisiten sind hier aufgeführt.

Das 2 wichtigste Requisiten AutoForm sollte das schema und das componentFactory sind.

Das Schema repräsentiert die Anwendungsdomäne. Alle Entitäten, Layouts und ihre Metadaten sind im Schema enthalten. Weitere Informationen hier.

Die ComponentFactory ist dafür verantwortlich, zu bestimmen, welche Reaktionskomponente für eine bestimmte Feldmetadaten verwendet werden soll. redux-autoform verfügt über keine integrierte Fabrik, da Sie entweder Bootstrap (Beta-Zustand) oder Material-UI (Beta-Zustand) verwenden können.

Unter der Annahme von Bootstrap können Sie die Fabriken wie diese erhalten:

 import { EditComponentFactory , DetailsComponentFactory } from 'redux-autoform-bootstrap-ui' ;

Eine dieser Fabriken sollte nun wie in den Dokumenten beschrieben als Prop -Autoform bestanden werden.

Lokalisierung

AutoForm hängt nicht direkt von der Lokalisierung ab, aber sowohl die Bootstrap- als auch die Material-UI-Fabriken. Wenn Sie diese verwenden, sollten Sie dies tun:

• Numbro installieren. Dies ist die Bibliothek, die für die Lokalisierung der Zahlen verwendet wird.
• Moment installieren. Dies ist die Bibliothek, die für die Lokalisierung von DateTime verwendet wird.

 // import moment and numbro
import moment from 'moment' ;
import numbro from 'numbro' ;
 // import the localizers
 import { momentLocalizer , numbroLocalizer } from 'redux-autoform' ;
// if you are using react-widgets, which is used by default on the standard factories, you need to import it's localizer too:
import reactWidgetsMomentLocalizer from 'react-widgets/lib/localizers/moment' ;
// set up the localizers
momentLocalizer ( moment ) ;
numbroLocalizer ( numbro ) ;

reactWidgetsMomentLocalizer ( moment ) ; // THIS IS ONLY IMPORTANT WHEN USING BOOTSTRAP 

Stile

Das Styling hängt von der Benutzeroberfläche ab, die Sie verwenden:

• Hinzufügen von Stilen für die Bootstrap -Benutzeroberfläche
• Hinzufügen von Stilen für die materielle Benutzeroberfläche (in der Entwicklung)

Aufbau und Laufen der Demo vor Ort

Redux-Autoform bietet eine wirklich minimalistische Demo. Um die Demo auszuführen, rennen Sie:

 npm run start

Jetzt sollte die Demo hier verfügbar sein: http: // localhost: 4000/.

Die Tests ausführen

 npm run test // will run the Karma tests PhantomJS
// OR
npm run test-chrome // will run the Karma tests on Chrome

Beitragen

Pull-Requests sind sehr willkommen . Wenn Sie nicht wissen, worauf Sie beibehalten sollen, überprüfen Sie bitte die Probleme.

Wir werden uns mehr als froh freuen, häufige Mitwirkende zur Beitritt zur Organisation einzuladen. Wenn Sie Hilfe beim Verständnis des Projekts benötigen, veröffentlichen Sie bitte ein Problem und ich werde mein Bestes tun, um zu antworten und sicherzustellen, dass Sie alles verstehen, was Sie brauchen.

Um eine Pull -Anfrage zu stellen:

1. Gib es.
2. Erstellen Sie Ihre Feature-Branch-Git-Kasse -b Your-New-Feature-Branch
3. Bestimmen Sie Ihre Änderung Git Commit -am 'Neue Funktion hinzufügen'
4. Drücken
5. Erstellen Sie eine neue Pull -Anfrage mit Master Branch

Lizenz

redux-autoform ist MIT lizenziert.