ReactJS无效的校验和

时间:2014-10-03 02:16:41

标签: reactjs

使用ReactJS&尝试服务器端渲染时,我一直收到以下错误:节点。

React attempted to use reuse markup in a container but the checksum was invalid.

我见过answer在服务器端传递相同的道具,客户端解决了这个问题。在我的例子中,我没有任何道具,所以我不确定答案是否适用于我的问题。

您可以在我的github帐户中查看完整示例。

我在下面列出了重要的代码。非常感谢任何见解。

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;
}

服务器

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);

1 个答案:

答案 0 :(得分:13)

更改

React.renderComponent(<index/>, document.documentElement);

React.renderComponent(<index/>, document);

并且通知消失了。

Screenshot