JSX
2020-07-29 本文已影响0人
海豚先生的博客
JSX中的特殊属性写法
- className
- htmlFor
- input/img单标签必须有闭合斜杠
- style属性传的是对象形式
- 输出组件:let a = <Com1 />jsx中输出中写{a}
- 输出组件数组:let arr = [Com1,Com2,Com3]jsx中输出的写法{arr}
函数作为子元素
// 调用子元素回调 numTimes 次,来重复生成组件
function Repeat(props) {
let items = [];
for (let i = 0; i < props.numTimes; i++) {
items.push(props.children(i));
}
return <div>{items}</div>;
}
function ListOfTenThings() {
return (
<Repeat numTimes={10}>
{(index) => <div key={index}>This is item {index} in the list</div>}
</Repeat>
);
}