Wer soll "handleSubmit" übergeben

Question

Ich sehe WidgetForm.js Probe in react-redux-universal-hot-example (die beliebteste react + redux boilerplate). Am Ende gibt es eine Schaltfläche, die handleSubmit ruft Daten an den Server zu senden:

<button className="btn btn-success" 
       onClick={handleSubmit(() => save(values)... 

Ich bin verwirrt, wo handleSubmit Funktion kommt. Ich überprüfte Widgets Container und es übergibt es nicht, wenn WidgetForm darstellt. Wird es automatisch von einem Plugin injiziert? Oder ist es auf einer höheren Ebene getan? Ich bin ziemlich neu zu reagieren + redux und ich bin verloren.

Answer 1

Die handleSubmit prop aussehen würde entfernen waren, ist Der Übergabehandler wurde von redux form über den Dekorierer übergeben:

@reduxForm({ 
    form: 'widget', 
    fields: ['id', 'color', 'sprocketCount', 'owner'], 
    validate: widgetValidation 
}) 
export default class WidgetForm extends Component { 

Im Kontext übergeben Sie dieser Komponente eine onSubmit-Funktion, die später vom handleSubmit-Callback aufgerufen wird. Dies ermöglicht Redux-Formular, Validierung durchzuführen, die Formularwerte zu sammeln, Fehler usw. zurückzugeben, wenn das Formular über eine Aktion übermittelt wird.

Answer 2

Es ist verwirrend, aber wenn Sie in Zeile 34 schauen, werden Sie

const { editStop, fields: {id, color, sprocketCount, owner}, formKey, handleSubmit, invalid, 
    pristine, save, submitting, saveError: { [formKey]: saveError }, values } = this.props; 

sehen Wenn Sie dieses handleSubmit von diesem Aliasing Ihre Schaltfläche wie

<button className="btn btn-success" 
       onClick={this.props.handleSubmit(() => save(values)...