Reactjs 多次呈现组件React.js

这是一个简单计数器的代码

然而，当我渲染视图时，我没有得到任何输出。请告诉我代码有什么问题

按下按钮，计数器递增并呈现在屏幕上

 var Title = React.createClass({

  getInitialState : function(){
    return {count:0};
  },
  increment : function(){

    this.setState({count:this.state.count+this.props.incVal});
  },
  render: function() {
    return (
      <div>
        <h1 >Count : {this.state.count}< /h1>
        <button onClick={this.increment} >Increment</button>
      </div>
    );
  }
});




var MultiButton = React.createClass({
  render : function (){
    return(
      <Title incVal={1}/>
      <Title incVal={5}/>
    );
  }
});

ReactDOM.render( <MultiButton /> ,
  document.getElementById('example')
);

var Title=React.createClass({
getInitialState:函数（）{
返回{count:0}；
},
增量：函数（）{
this.setState（{count:this.state.count+this.props.incVal}）；
},
render:function（）{
返回(
计数：{this.state.Count}
增量
);
}
});
var MultiButton=React.createClass({
渲染：函数（）{
返回(
);
}
});
ReactDOM.render（，
document.getElementById（'示例'）
);

来自

以下是一份清单：

项目1
项目2

一个React组件不能返回多个React元素，但只能返回一个React元素 JSX表达式可以有多个子项，所以如果您想要一个组件 要渲染多个对象，可以像这样将其包装在一个div中

从

var MultiButton = React.createClass(
  {
    render: function () {
      return (
        <Title incVal={1}/>
        <Title incVal={5}/>
      );
    }
  }  
);

var MultiButton=React.createClass(
{
渲染：函数（）{
返回(
);
}
}  
);

到

var MultiButton=React.createClass(
{
渲染：函数（）{
返回(
);
}
}  
);

不能从React类返回多个元素。如果有多个元素，请将它们包装在一个div中，如

var MultiButton = React.createClass({
  render : function (){
    return(
      <div>
          <Title incVal={1}/>
          <Title incVal={5}/>
      </div>
    );
  }
});

var MultiButton=React.createClass({
渲染：函数（）{
返回(
);
}
});

var Title=React.createClass({
getInitialState:函数（）{
返回{count:0}；
},
增量：函数（）{
this.setState（{count:this.state.count+this.props.incVal}）；
},
render:function（）{
返回(
计数：{this.state.Count}
增量
);
}
});
var MultiButton=React.createClass({
渲染：函数（）{
返回(
);
}
});
ReactDOM.render（，
document.getElementById（'示例'）
);

除了下面Rafael给出的正确答案外，react在浏览器控制台中也会显示一些不错的错误消息（在大多数浏览器中按F12打开）。当出现问题时，在浏览器控制台中查看错误日志可能是一个很好的做法。

var MultiButton = React.createClass(
  {
    render: function () {
      return (
        <div>
          <Title incVal={1}/>
          <Title incVal={5}/>
        </div>
      );
    }
  }  
);

var MultiButton = React.createClass({
  render : function (){
    return(
      <div>
          <Title incVal={1}/>
          <Title incVal={5}/>
      </div>
    );
  }
});

 var Title = React.createClass({

  getInitialState : function(){
    return {count:0};
  },
  increment : function(){

    this.setState({count:this.state.count+this.props.incVal});
  },
  render: function() {
    return (
      <div>
        <h1 >Count : {this.state.count}< /h1>
        <button onClick={this.increment.bind(this)} >Increment</button>
      </div>
    );
  }
});




var MultiButton = React.createClass({
  render : function (){
    return(
      <Title incVal={1}/>
    );
  }
});

ReactDOM.render( <MultiButton /> ,
  document.getElementById('example')
);