无法在 ReactJS 的第一个组件中加载第二个组件

Question

为什么我的第二个组件没有加载到第一个组件中？代码如下：

var ComponentOne = React.createClass({
    render: function(){
      return(
        <div>
          <h1>ComponentOne</h1>
          <componentTwo />
        </div>
      )
    },
  });

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

这里我通过<componentTwo />在第一个组件中添加了第二个组件，但仍然没有显示。

这里是a Plunker。

Answer 1

只要用大写字母开头你的component2就可以了

类似

var ComponentOne = React.createClass({
    render: function(){
      return(
        <div>
          <h1>ComponentOne</h1>
          <ComponentTwo />
        </div>
      )
    },
  });

  var ComponentTwo = React.createClass({
    render: function(){
      return(
        <div>
          <h2> componentTwo </h2>
        </div>
      )
    }
  })

为什么是大写字母？解释可以在这里找到https://stackoverflow.com/a/30373505/2551236

希望这会有所帮助！

祝你好运！