React.createElement和React. cloneElement

React.createElement

语法格式

React.createElement(
	type,
	[props],
	[...children]
)

React.createElement(
	'div',
	id:'element1',
	'Hello,World1!'
)

React.createElement(
	'div',
	id:'element2',
	'Hello,World2',
)

const element3 = React.createElement(
    'div',
    {id:'element3'},
    [element1,element2],
)

说明
JSX语法用来构建React元素的，它接受3个参数：

1. type 是一个标签名，如：div、p，或者React组件。
2. props为传入的属性
3. 第三个以及之后的参数children，皆作为组件的子组件。

React.cloneElement
语法：

React.cloneElement(
	element,
	props,
	[...children]
)

1. type 用于克隆的母体React元素
2. props 为克隆后生成的React元素添加新的Props或者覆盖从母体克隆出来的部分或者全部props。
3. children 为新生成的React元素添加新的children，取代从母体克隆出来的children。

render(){
    const element = super.render();
    const newStyle = {
        color: element.type === 'div'?'red':'blue'
    }
    const newProps = {...this.props,style:newStyle};
    return React.cloneElement(element,newProps,element.props.children);
}