reactjs – 如何使用`React.createElement` children参数(不带jsx)

React.createElement传递一个“children”参数
var d = React.DOM;

React.createElement(LabeledElement,{label: "Foo"},d.input({value: "foo"})
)

但是我找不到任何关于如何实际使用它的文档

var LabeledElement = React.createClass({
    render: function() {
        return d.label({},d.span({classNames: 'label'},this.props.label),//How to place children here? 
    }
})

我确定这有一个非常简单的答案.

孩子们通过JSX嵌套或者通过React.createElement的第三个参数传递给一个组件,在组件中显示为this.props.children:
var MyLabel = React.createClass({
  render: function() {
    return React.createElement("label",{className: "label"},React.createElement("span",this.props.children
    );
  }
});

var App = React.createClass({
  render: function() {
    return React.createElement(MyLabel,{label: "Here is the label prop"},React.createElement("div",{},React.createElement("input",{type: "text",value: "And here is a child"})
      )
    );
  }
});

示例:http://jsfiddle.net/BinaryMuse/typ1f2mf/; docs:http://facebook.github.io/react/docs/multiple-components.html#children

相关文章

一、前言 在组件方面react和Vue一样的,核心思想玩的就是组件...
前言: 前段时间学习完react后,刚好就接到公司一个react项目...
前言: 最近收到组长通知我们项目组后面新开的项目准备统一技...
react 中的高阶组件主要是对于 hooks 之前的类组件来说的,如...
我们上一节了解了组件的更新机制,但是只是停留在表层上,例...
我们上一节了解了 react 的虚拟 dom 的格式,如何把虚拟 dom...