Ist Material-Ui freundlich zu bilden?

Question

In letzter Zeit, wenn ich React & Material-ui verwenden, um ein Formular zu erstellen, finde ich, dass viele Komponenten nicht "name" -Eigenschaft, wie "SelectField" haben. Also muss ich den Wert durch eine Methode bekommen. Ist Material-ui geeignet, ein Formular zu implementieren? Wenn die Antwort ja lautet, können Sie mir ein intaktes Beispiel geben, das einige Komponenten wie 'TextField', 'SelectField' verwendet und wie kann ich es einreichen?

Answer 1

Ich konnte connectin Material-ui mit redux-Form empfehlen:

http://redux-form.com/6.8.0/examples/material-ui/

funktioniert gut, solange Sie Komponente zu übergeben darstellt Material-ui Form in das Feld von reagieren redux

import { Field } from 'redux-form/immutable'; 
import TextField from 'material-ui/TextField'; 

<Field 
    name="username" 
    id="username" 
    type="text" 
    placeholder="Username" 
    label="Username" 
    required 
    iconName="person" 
    component={TextField} 
    /> 

Und dann hätten Sie Formularwerte im Redux-Zustand.

Answer 2

Dies ist eigentlich kein Material-ui spezifisches Problem, das ich glaube. Sie werden im selben Boot sein, wenn Sie einfache <input> Elemente verwenden.

Grundsätzlich möchten Sie den Wert eines Textfelds/Kontrollkästchens erhalten/festlegen, wenn ein Benutzer eine Aktion ausführt oder auf Senden klickt. Mit Material-ui können Sie hübsche, wiederverwendbare und designte Komponenten erstellen, so dass Sie sie nicht selbst schreiben müssen.

Um einfach mit Formularen arbeiten zu können, hätten Sie einige zusätzliche Codierungen von Ihrer Seite aus vorgenommen. Ich schlage auch die große Bibliothek redux-form vor, aber es würde erfordern, dass Sie redux in Ihrer APP auch implementieren (eine große Sache an sich aber ich weiß nicht, was Ihre Anforderungen sind).

Wenn Sie eine weitere Option, dann können Sie https://github.com/christianalfoni/formsy-react verwenden, die ist eine andere große und beliebte Bibliothek für Formulare und doesnt Verwaltung erfordern redux

Wenn Sie die Dinge selbst dann können Sie Empfehlungen von https://facebook.github.io/react/docs/forms.html die im Allgemeinen verwenden tun wollen sagen Sie haben kontrollierte Komponenten.

Eine letzte Sache. Haben Sie keine Angst, zusätzliche Bibliotheken und Module zu verwenden. Der springende Punkt bei den hunderten von Modulen ist, dass Leute sie benutzen =]