Flexbox内容无法在React中呈现？

Question

我正在尝试在React中创建一个flexbox，我想在其中放置两个div，一个在另一个之上。我无法获取要渲染的两个div的内容。现在，我有：

class Flexbox extends Component {
  render() {
    return (
      <div className="col-lg-5" style={{flex: 1, alignItems:'center'}}>

      </div>
    );
  }
}

class DivOne extends Component {
  render() {
    return (  
      <div>
        <p>
          Welcome!
        </p>
      </div>  
    );
  }
}

class DivTwo extends Component {
  render() {
    return (  
      <div>
        <p>
           Some text here
        </p>
      </div>  
    );
  }
}

class Final extends Component {
  render() {
    return (
      <div>
          <div className="container">
            <div className="row">
              <Flexbox>
                <DivOne />
                <DivTwo />
              </Flexbox>

              <AnotherComp />
            </div>
          </div>
      </div>
    );
  }
}

当我将所有DivOne和DivTwo的内容放入flexbox的主要div中时，我可以看到我的文本。当我把孩子们送到Flexbox时，我不确定我做错了什么。