3

現在、node.js + Express ビルドに同形反応コンポーネントを実装しようとしています。ただし、上記のコンポーネントを jade テンプレートに含めてレンダリングしようとすると、次のエラーが発生します: TypeError: Can't add property context, object is not extensible

ここに私のルートファイルがあります:

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 プロパティを設定しないでください。代わりに、要素を最初に作成するときに正しい値を指定してください。

誰でも私を助けることができますか?どうもありがとう

4

1 に答える 1

5

react.createFactory()の周りに呼び出しを追加することgriddle-reactで、JSX の代わりにプレーンな JavaScript を使用することを示します。したがって、後続の render 関数で Griddle 用の JavaScript 関数を使用する必要があります。

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

すでに持っている JSX 構文を使用したい場合は、呼び出しgriddle-reactなしで単に require します。React.createFactory()

于 2015-07-04T17:52:40.477 に答える