我如何使用循环与反应?
这个问题在这里已经有了答案:
组件的render
方法或无状态组件函数返回要呈现的元素。
如果你想使用循环,那很好:
render() {
let menuItems = [];
for (var i = 0; i < Users.length; i++) {
menuItems.push(<MenuItem eventKey=[i]>User.firstname[i]</MenuItem>);
}
return <div>{menuItems}</div>;
}
更常见的是看到更多的功能风格,比如使用地图返回元素数组:
render() {
return <div>
{
Users.map((user, i) =>
<MenuItem eventKey=[i]>User.firstname[i]</MenuItem>)
}
</div>;
}
请注意,无论哪种情况,您都缺少数组中每个元素的key
属性,因此您将看到警告。 数组中的每个元素都应该有一个唯一的键,最好是某种形式的ID,而不仅仅是数组索引。
有了地图,你可以做到:
Users.map((user, index) => (
<MenuItem eventKey={index}>user.firstname</MenuItem>
));
链接地址: http://www.djcxy.com/p/52041.html