Render React Component zu Fancybox

Ich habe eine Reaktionskomponente und möchte es in einfachen HTML-Code umwandeln, um die Vorlage in eine Fancybox zu werfen.Render React Component zu Fancybox

Leider habe ich keine Idee, wie das zu tun, außer die Komponente zu einem HTML-Sting Rendern und geben Sie das an fancybox.

Das Problem ist, dass ich kein DOM-Element habe, vor dem die Komponente in gerendert werden kann.

Hat jemand das schon mal gemacht?

Als ich

ReactDOM.renderToString() aufrufen, es sagt mir den Zielbehälter ist kein DOM-Element.

Quelle

2016-07-12 d.a.d.a

Machst du sowas?

import ReactDOMServer from 'react-dom/server'; 

console.log(ReactDOMServer.renderToString(<div>foo</div>));

Ich habe ein funktionierendes Beispiel hier: http://www.webpackbin.com/4JVJDJA8W

Es macht die Zeichenfolge und setzt dann das Ergebnis als Innertext auf der Seite.

Quelle

2016-07-12 13:57:59 ctrlplusb

Hallo nein, es ist eher wie console.log (ReactDOMServer.renderToString ()); –

Das sollte funktionieren. Siehe mein laufendes Beispiel, das ich gerade gepostet habe. – ctrlplusb

okay, aber da ich Redux verwende, erhalte ich jetzt die Fehlermeldung: Ungefangen Invariant Violation: "Laden" konnte weder im Kontext noch in den Requisiten von "Connect (Pnap)" gefunden werden. Entweder wickle die Root-Komponente in eine oder übertrage explizit "store" als Requisite an "Connect (Pnap)". Wie kann ich von meiner reagierenden Komponente auf den Laden zugreifen –

Render React Component zu Fancybox

Antwort

Verwandte Themen