2014-02-06 5 views
6

In Backbone.js können Sie das Element einer Ansicht mithilfe der el-Eigenschaft oder durch Aufruf von view.setElement() angeben.React.js: Bindung an vorhandene Elemente

Gibt es eine gleichwertige Möglichkeit, eine React.js-Komponente an ein bestehendes DOM-Element anzuschließen?

+0

Vielleicht hilft dies ... http://stackoverflow.com/questions/27160763/can-a-react-component-manipulate-an-existing-dom-node/34630247#34630247 – gdoumenc

Antwort

10

Ich bin nicht mit Backbone übermäßig vertraut, aber um eine React-Komponente in das DOM zu haken verwenden Sie die renderComponent-Funktion. Die erste Arg- ist die Komponente, und die zweite ist eine DOM-Element:

React.renderComponent(<SampleComponent />, document.getElementById('app')); 

pro Rahmen in den Kommentaren gegeben aktualisiert:

Haken Reagieren bis auf ein Element durch seinen Inhalt zu ersetzen , aber nicht das Element selbst. Sie können renderComponent() mehr als einmal für dieses Element aufrufen und es wird jedes Mal derselbe diff-Algorithmus ausgeführt. Dies ist praktisch, wenn Sie verschiedene Requisiten übergeben, auf dem Server rendern oder eine andere Komponente rendern möchten. Der gleiche Prozess wird verwendet, um das tatsächliche DOM jedes Mal zu aktualisieren, als ob Sie setState() innerhalb der Komponente selbst verwenden würden.

+0

Ist das nicht die Stelle SampleComponent als Kind von #app? Ich denke, dass das OP versucht, ein vorhandenes Element durch die Komponente zu ersetzen. –

+0

@EdwardMSmith Ah, ich kannte Backbones Verhalten nicht. Ich werde meine Antwort aktualisieren. –

+1

Danke - ja, um zu klären, ich beziehe mich auf Elemente geladen serverseitig wie eine Auswahlmenüoption, die wissen muss, ob ihre Standardsortierreihenfolge aufsteigend oder absteigend ist. Das Element ist also bereits vorhanden, wenn die Seite geladen wird, und ich muss Backbone/React verwenden, um zusätzliches Verhalten/Daten an es zu binden, ohne es mit einer clientseitigen Vorlage oder einer React-Komponente von Grund auf neu rendern zu müssen. Ich kann meine Frage erweitern, wenn es hilfreicher ist. – cantera