将特定子组件与通用父组件一起使用答案

【问题标题】：Using specific child components with a generic parent component将特定子组件与通用父组件一起使用
【发布时间】：2014-06-13 15:09:24
【问题描述】：

也许我的想法是错误的，因为我最近才开始接触 ReactJS，所以请随时纠正我的思维方式。

我想要做的是（理论上）能够拥有 N 个特定的子组件，这些子组件可以放入单个父组件中，但我不确定如何告诉父组件渲染哪个子组件。

例如，我编写了一个标签容器，它现在只呈现一个内容区域。内容区域将是parent。我希望有 N 种不同类型的项目可以进入这个内容区域。这些项目将是children。

我是否可以使用单个父组件，并且有人可以动态选择要呈现的子组件类型，而无需经历父组件中条件语句的麻烦？

如果我的问题不清楚，请告诉我。

提前谢谢你！

【问题讨论】：

标签： reactjs

【解决方案1】：

我有时会这样做：

var Parent = React.createClass({
  render: function() {
    return React.DOM.div({}, this.props.childClass(this.props.childProps));
  }
});

或：

var Parent = React.createClass({
  render: function() {
    return React.DOM.div({children: this.props.children});
  }
});

Parent({}, ChildClass({foo: 'asdf'}))

【讨论】：