5

コンパイルされないこの例を考えてみましょう:

/** @jsx React.DOM */

var Hello = React.createClass({
  render: function() {
    return <div>Hello</div>;
  }
});

var World = React.createClass({
  render: function() {
    return <div>World</div>;
  }
});

var Main = React.createClass({
  render: function() {
    return (
        <Hello />
        <World /> 
    );
  }
});

React.renderComponent(<Main />, document.body);

ただし、これらの組み合わせはどれも機能します。

<div>
 <Hello />
 <World />
</div>

 <Hello />
 //<World />

 //<Hello />
 <World />

複数のコンポーネントを常に div タグで囲む必要があるかどうかを知りたい。

4

3 に答える 3

8

render 関数は 1 つのコンポーネントのみを返す必要があると思います。

ドキュメントから: http://facebook.github.io/react/docs/component-specs.html

render() メソッドが必要です。

呼び出されると、this.props と this.state を調べて、1 つの子コンポーネントを返す必要があります。

于 2014-03-09T10:12:56.173 に答える
4

この制限を回避する簡単な方法があります。

var Hello = React.createClass({
  render: function() {
    return <div>Hello</div>;
  }
});

var World = React.createClass({
  render: function() {
    return <div>World</div>;
  }
});

var HelloWorld = [Hello, World];

var Main = React.createClass({
  render: function() {
    return (
        {HelloWorld}
    );
  }
});

React.renderComponent(<Main />, document.body);
于 2015-04-15T22:53:10.310 に答える
1

React コンポーネントは単一のルート ノードのみをレンダリングできます。複数のノードを返したい場合は、単一のルートにラップする必要があります。

公式の React サイトで指定されているとおり: React Docs

于 2014-04-30T07:33:47.707 に答える