Ich benutze redux-form (tolle libs) um mit meinem form & amp; redux Speichern Sie in Reagieren App. Alles funktioniert gut, wichtige Formulare und verschachtelte json-Ausgabe.
Ich versuche, React-Semantic-UI Komponente mit redux-form zu verwenden. Ich suchte in den Dokumenten, wie über benutzerdefinierte Komponente mit redux Form integrieren, und hier gehen wir: Ссылка Scheint perfekt.
Aber wenn ich Semantic integriere, funktioniert es.
Dies ist mein einfacher Test mit Pseudocode:
%Vor%und hier meine CustomComponent mit Dropdown. Sie können die Dropdown-Dokumentation & amp; Requisiten (onChange & amp; Wert) hier:
%Vor%Wie in der Dokumentation, fügte ich Wert & amp; onChange Requisiten auf meiner benutzerdefinierten Komponente.
Ich vermisse hier eindeutig etwas. Hat jemand ein einfaches Beispiel mit Redux-Form und Semantc-Ui?
Danke für Ihre Hilfe.
Ich fand, dass die akzeptierte Antwort in meinem Fall nicht funktionierte, Redux-Form feuert weiterhin eine FOCUS
-Aktion ab, die ein erneutes Rendern auslöst und mein Dropdown-Feld würde sich nicht öffnen. Möglicherweise mein schlechtes oder ein Update, aber hatte keine Zeit zu debuggen, kam also mit dieser Lösung.
Ich verwende Typescript und umgebe das Semantic UI Dropdown-Feld in einer benutzerdefinierten Komponente, die den Dropdown-Wert direkt aus dem Redux-Formular hinzufügt und abruft.
Funktioniert bis jetzt gut, sollte leicht zu Vanille-JS portiert werden.
ReduxFormSemanticDropdownComponent
Wenn Sie Typescript verwenden, ändern Sie AppState
als Ihren eigenen Status-Objekttyp.
Verwenden
Fügen Sie das zu Ihrer normalen redux-Form hinzu, und es sollte sich wie ein Standardfeld verhalten.
%Vor%Tags und Links javascript reactjs redux redux-form semantic-ui