React.createElement(标签,props对象,子节点1,子节点2,…):创建一个React元素,包含三个参数,
第一个参数必填,表示传入的HTML最外层标签;
第二个参数选填,表示属性,如className;
第三个参数选填,表示子节点或文本内容。
React.createElement(
type,
[props],
[...children]
)
具体使用:
jsx语法通过babel转化为js语法时,内部调用了React.createElement()方法
1、HTML标签
<ui className='tab-parentt' title='title-name'>
<li className='tab-child'>1</li>
<li>2</li>
</div>
React.createElement('ui', {
className: 'tab-parent',
title: 'title-name'
}, React.createElement('li', {
className: 'tab-child'
}, '1'), React.createElement('li', null, '2'))
2、自定义组件
function Comp() {
return <a>text</a>
}
<Comp key='1'>
<div className='hah'>2</div>
</Comp>
function Comp() {
return React.createElement('a', null, 'text')
}
React.createElement(Copm, {
key='1'
}, React.createElement('div', {
className: 'hah'
}, '2'))
3、React.Fragment组件
<>
<div className='tab-parent' title='title-name'>
<div className='tab-child'></div>
<div>2</div>
</div>
<>
React.createElement(React.Fragment, null,
React.createElement('div', {
className: 'tab-parent',
title: 'title-name'
}, React.createElement('div', {
className: 'tab-child'
}, '1'), React.createElement('div', null, '2')))
FROM
https://www.cnblogs.com/sunxiaopei/p/12205447.html