Node.js React:无法添加属性上下文,对象不可扩展

Question

我目前正在尝试在我的node.js + express build中实现一个同构反应组件.但是,当我尝试将所述组件包含到我的jade模板中进行渲染时,我收到此错误:TypeError:无法添加属性上下文,对象不可扩展

这是我的路线文件:

var express = require('express');
var router = express.Router();


var React = require('react/addons'),
  ReactApp = React.createFactory(require('../../react/components/ReactApp'));

/* GET home page. */
router.get('/', function(req, res, next) {
  var reactAppEl = ReactApp();
  console.log(reactAppEl);
  var reactHtml = React.renderToString(reactAppEl);
  res.render('index', { reactOutput: reactHtml });
});

module.exports = router;

组件:

/** @jsx React.DOM */

var React = require('react/addons');

/* create factory with griddle component */
var Griddle = React.createFactory(require('griddle-react'));

var fakeData = require('../data/fakeData.js').fakeData;
var columnMeta = require('../data/columnMeta.js').columnMeta;
var resultsPerPage = 200;

var ReactApp = React.createClass({

  componentDidMount: function () {
    console.log(fakeData);

  },
  render: function () {
    return (
      <div id="table-area">

        <Griddle results={fakeData}
                 columnMetadata={columnMeta}
                 resultsPerPage={resultsPerPage}
                 tableClassName="table"/>

      </div>
    )
  }
});

/* Module.exports instead of normal dom mounting */
module.exports = ReactApp;

此外,我的gulp任务会发出警告,警告:组件(...):render在返回的组件实例上找不到任何方法:您可能忘记render在组件中定义,或者您可能不小心尝试渲染类型为函数的元素那不是React组件.警告:不要设置React元素的props属性.而是在最初创建元素时指定正确的值.

谁能帮我？非常感谢

Answer 1

通过添加react.createFactory()调用griddle-react,您表示您将使用纯JavaScript而不是JSX.因此,您需要在后续的渲染函数中使用Griddle的JavaScript函数:

return Griddle({results: fakeData,
                columnMetadata: columnMeta,
                resultsPerPage: resultsPerPage,
                tableClassName: "table"});

如果您想使用已有的JSX语法,只需要griddle-react不需要React.createFactory()调用即可.