我在尝试使用数据数组呈现 <ul>
元素时遇到问题。在下面的代码中 console.log
工作正常,但列表项没有出现。
var Main = React.createClass({
getInitialState: function(){
return {
data: dataRecent
}
},
render: function(){
return (
<div>
<ul>
{
this.state.data.map(function(item, i){
console.log('test');
<li>Test</li>
})
}
</ul>
</div>
)
}
});
ReactDOM.render(<Main />, document.getElementById('app'));
我究竟做错了什么?请随时指出任何不是最佳实践的地方。
原文由 user6542445 发布,翻译遵循 CC BY-SA 4.0 许可协议
Gosha Arinich 是对的,你应该返回你的
<li>
元素。但是,在这种情况下,您应该在浏览器控制台中收到讨厌的红色警告因此,您需要将“密钥”添加到您的列表中:
或删除
console.log()
并使用 es6 箭头函数 做一个漂亮的单线:重要更新:
上面的答案是解决当前的问题,但正如 Sergey 在评论中提到的那样:如果你想做一些过滤和排序,使用取决于地图索引的键是 不好 的。在这种情况下,使用
item.id
如果id
已经存在,或者只为它生成唯一的 ID。