Ausgangszustand von der Komponente mit Server-Seite zu speichern

Question

Anwendung A-Rendering werden Daten an Anwendung B posten, die den Anfangszustand für Application B. Um dies zu tun sein wird, ich Verwendung von Reactjs.Net

Anwendung B erhalten mache Anfangsdaten als Post-Daten von Anwendung A. Ich muss diese Post-Daten als initialState in meinem Geschäft festlegen. Um dies zu tun, benutze ich Reactjs.net.

Ich habe die Post-Daten im Controller gelesen, die Daten meinem Objekt zugeordnet und es viewbag zugewiesen, um es in meiner Ansicht verfügbar zu machen.

Unten ist, wie meine Ansicht aussieht. Ich lese die InitialData von ViewBag und weise sie zu, damit auf sie in meiner React-Komponente zugegriffen werden kann.

@Styles.Render("~/css") 
@Scripts.Render("~/scripts") 

@Html.React("InitialData", new { LoadData = ViewBag.InitialDataObject }) 

<script src="/react-15.0.1.js"></script> 
<script src="/react-dom-15.0.1.js"></script> 

<div class="container pad-l-0px pad-r-0px"> 
    <div id="app"></div> 
</div> 

<script src="~/public/bundle.js"></script> 

In der Komponente React kann ich die Daten erhalten. Wie gebe ich diese Daten als initialState an den Store weiter und was ist der beste Weg?

var InitialData = React.createClass({ 
    getInitialState: function() { 
     return { InitialLoadData: this.props.LoadData }; 
    }, 
    render: function() { 
     return (
      <div></div> 
    ); 
    } 
}); 

Ich werde Server-Side-Rendering nur verwenden, um den Ausgangszustand festzulegen. Ich weiß, dass ich die Daten einer globalen Variable in meiner Ansicht zuweisen kann und auf diese Variable in meinem Reduzierer direkt zugreife. Aber ich möchte das vermeiden.

Answer 1

Wenn Sie Redux verwenden, liefern Sie keine Ausgangsspeicherdaten von einer Komponente, aber Sie liefern es als Parameter für createStore.

Normalerweise würden Sie Ihren Anfangszustand einer Skriptvariablen in der serverseitigen Ausgabe zuweisen und diese Variable bei der Initialisierung Ihres Geschäfts verwenden.

Siehe diese Seite für ein ausführliches Beispiel: http://redux.js.org/docs/recipes/ServerRendering.html