[深入React] 3.JSX的神秘面纱
<div>
<List />
</div>
会被编译为:
React.createElement("div",null,
React.createElement(List, null)
);
React.createElement 方法说明:
- 第一个参数
- 如果是小写标签(如:div)变成字符串,意义是html标签
- 如果是大写标签(如:List)变成变量,意义是react组件
- 大括号会被当作js表达式
<div className="box">
hello {'w' + 'orld'}<i/>
</div>
会被编译为:
React.createElement('div',{
className:"box"
},
'hello ' + 'w' + 'orld',
React.createElement('i', null)
);
- 第二个参数是属性(
props
),类型为object
- 第三个参数开始为
子元素
,或者子元素数组