Continuo a ricevere il seguente errore durante il tentativo di rendering lato server utilizzando il nodo ReactJS &.checksum ReactJS non valido
React attempted to use reuse markup in a container but the checksum was invalid.
Ho visto un answer che passando gli stessi oggetti di scena sul server e client risolve questo problema. Nel mio esempio, non ho oggetti di scena, quindi non sono sicuro che la risposta sia valida per il mio problema.
È possibile visualizzare il mio esempio completo sul mio account github.
Sto includendo il codice importante qui sotto. Qualsiasi consiglio é ben accetto.
JSX
/** @jsx React.DOM */
var React = require('react');
var index = React.createClass({
render: function() {
return (
<html>
<head>
<script src="bundle.js"></script>
</head>
<body>
<div>
hello
</div>
</body>
</html>
);
}
});
if (typeof window !== "undefined") {
React.renderComponent(<index/>, document.documentElement);
} else {
module.exports = index;
}
Server
require('node-jsx').install();
var express = require('express'),
app = express(),
React = require('react'),
index = require('./index.jsx');
var render = function(req, res){
var component = new index();
var str = React.renderComponentToString(component);
res.set('Content-Type', 'text/html');
res.send(str);
res.end();
}
app.get('/',render);
app.use(express.static(__dirname));
app.listen(8080);
A volte, è qualcosa di così semplice. Grazie. Come hai conosciuto la risposta così velocemente? – Nael
Ho avuto un sospetto quindi ho giocato con esso. :) A ben vedere, 'document.documentElement' * è * l'elemento HTML, e' document' * contiene * it, e React esegue il rendering in elementi, quindi se vuoi rendere il tag 'html', devi renderizzare contenitore. –
Ottima risposta. Grazie ancora! – Nael