组件化类
2019-03-07 本文已影响0人
笨笨猿
<body>
<div id="app"></div>
<script type="text/babel">
var users = ['欧阳', '肖磊', '大飞哥'];
var user2 = ['啤酒', '花生', '瓜子'];
/*
如果一个函数或类作为一个组件去使用的话，那么他的名称必须是首字母大写。即下边的List首字母必须大写
如果使用类实现组件，那么需要继承一个父类：React.Component,组件类必须实现一个render()方法.
props：传入的参数必须是用对象下的一个属性props来接收
*/
class List extends React.Component {
render() {
return this.props.data.map((item, index) => {
return <li key={index}>{item}</li>;
});
}
}
ReactDOM.render(
<div>
<ul>
<List data={users} />
</ul>
</div>,
document.getElementById('app')
);
</script>
</body>
</html>
