2017-02-02 2 views
1

Ich habe ein Formular, dieses Formular muss einige Daten in meinem Back-End veröffentlichen. Was ist die beste Vorgehensweise, um dies zu tun, verwenden Sie ein Geschäft?Formulare in reactjs mit Fluss

Mein Problem mit der Verwendung eines Geschäfts ist, dass ich eine Unterkomponente in meinem Formular habe, die es mir ermöglicht, eine Nummer 1-5 mit Schaltflächen auszuwählen. Ich wollte, dass diese Komponente wiederverwendbar ist, aber wenn ich einen Speicher verwende, muss ich den Speicher fest in die untergeordnete Komponente einkodieren, was bedeutet, dass ich ihn an keiner anderen Stelle verwenden kann. Stattdessen setze ich einfach den Elternstatus vom Kind?

Wenn jemand auf einige gute Tutorials oder Beispiele von react/flux Formen hinweisen kann, lassen Sie es mich wissen.

Antwort

0

Meiner Meinung nach jeder Back-End-Interaktion mithilfe von Aktionen durchgeführt werden soll, aber ...

, wenn Sie Speicher verwenden mögen sowieso dann können Sie zusätzliches Attribut erstellen (prop) in der Unterkomponente, die sein wird, eine Funktion (z. B. onChange), die von der übergeordneten Komponente als prop übergeben werden soll (diese Funktion sollte Daten im Speicher ablegen). Dann können Sie diese Komponente wiederverwenden, da nur der Elternteil Zugriff auf den Speicher haben muss.

So in Subkomponente:

onButtonClick(e) { 
    this.state.value = e.target.value; 
    if (this.props.onChange) this.props.onChange(e.target.value); 
} 


<div> 
    <button onClick={this.onButtonClick.bind(this)} value="1">1</button> 
    <button onClick={this.onButtonClick.bind(this)} value="2">2</button> 
    <button onClick={this.onButtonClick.bind(this)} value="3">3</button> 
    <button onClick={this.onButtonClick.bind(this)} value="4">4</button> 
    <button onClick={this.onButtonClick.bind(this)} value="5">5</button> 
</div> 

und in parent:

setMyStoreState(value) { 
    store.setNumber(value); 
} 

<Subcomponent onChange={this.setStoreState.bind(this)} /> 

oder so etwas.

Code nicht getestet, aber Sie sollten die Idee bekommen.

+0

Also in Ihrer Meinung, wo speichern ich die Formulardaten vor dem Abfeuern einer Aktion, um die Daten zu buchen? –

+0

Im Komponentenstatus – Morishiri

+0

, die mehr Sinn macht, sehe ich immer nur Leute mit Stores. Deshalb war ich voreingenommen –