嵌套 React.js 组件答案

【问题标题】：Nesting React.js Components嵌套 React.js 组件
【发布时间】：2014-11-17 18:01:22
【问题描述】：

我想在父组件的渲染中调用嵌套组件的渲染。这是我到目前为止所尝试的。有这种模式吗？谢谢。

var nest = React.createClass({
  render: function() {
    return React.DOM.div({
      className: 'boop' 
    }, 'hello')
  }
})

var comp = React.createClass({
  render: function() {
    return React.DOM.div({
      className: 'beep', 
      children: React.renderComponent(nest(this.props))
    })
  }
})

React.renderComponent(comp(props), document.body)

预期：

  <body>
    <div class='beep'>
      <div class='boop'>
        hello
      </div>
    </div>
  </body>

【问题讨论】：

为什么要这样做？为什么不让 React 处理渲染？

标签： javascript reactjs

【解决方案1】：

你只是把它当作孩子传递：

var comp = React.createClass({
  render: function() {
    return React.DOM.div({
      className: 'beep'
    }, nest(this.props))
  }
});

React.renderComponent 用于声明根组件及其挂载点（有时是多个）。它不在组件中使用。

【讨论】：

啊，我明白了。这就说得通了。谢谢。