将子组件作为子对象作为属性

我已经看到可以将子组件作为子对象或属性传递给React组件。将子组件作为子对象作为属性

I.e.下面SSCCE体现了这两种方法：

$(document).ready(doStuff); 

function doStuff() { 

    ReactDOM.render(
      <App1> 
       <li>line 1 </li> 
       <li>line 2 </li> 
      </App1>, $('#app1')[0]); 

    ReactDOM.render(
      <App2 child1={<li>line 1</li>} 
        child2={<li>line 2</li>} 
      /> , $('#app2')[0]);  

} 

const App1 = React.createClass({ 
    render: function() { 
     return (
      <ul> 
       {this.props.children} 
      </ul> 
     ); 
    } 
}); 

const App2 = React.createClass({ 
    propTypes: { 
     child1: React.PropTypes.object.isRequired, 
     child2: React.PropTypes.object.isRequired 
    }, 
    render: function() { 
     return (
      <ul> 
       {this.props.child1} 
       {this.props.child2} 
      </ul> 
     ); 
    } 
});

我的问题是：

是有两种方法之间的差异（相对于cloneElement例如也许）？我所看到的一个区别是，使用道具方法，我可以在propTypes中添加有关从属组件的类型信息。
如果从属子元素作为属性传递，那么在propsTypes属性中指示他们是React组件而不是任何通用JavaScript对象？做一个console.log(this.props.child1.constructor.name)只需打印Object。

来源

2016-06-13 Marcus Junius Brutus

this.props.children的优点是容器组件的语法糖。

但它有很多限制。问题是，它不是一个普通的数组，甚至不包含数组，当它包含少于2个元素时，所以您需要使用专用工具，如React.Children.map而不是标准工具，如Array的map。

如果道具对你很好，继续使用它。

来源

2016-06-13 14:15:20

将子组件作为子对象作为属性

回答

相关问题