本文介绍了如何通过ReactJS中的对象进行映射?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我得到的响应如下:
我要在此HTML中显示每个对象的名称:
{subjects.map((item, i) => (
<li className="travelcompany-input" key={i}>
<span className="input-label">{ item.name }</span>
</li>
))}
但它引发错误subjects.map is not a function
。
首先,我必须定义对象的键,它将在其中创建一组键,我要在其中循环并显示subject.names
。
我还尝试了这个:
{Object.keys(subjects).map((item, i) => (
<li className="travelcompany-input" key={i}>
<span className="input-label">key: {i} Name: {subjects[i]}</span>
</li>
))}
推荐答案
调用Object.keys
时返回对象键的数组。
Object.keys({ test: '', test2: ''}) // ['test', 'test2']
当您调用Array#map
时,您传递的函数将为您提供两个参数;
- 数组中的项,
- 项目的索引。
当您想要获取数据时,需要使用item
(或者在下面的示例中使用keyName
),而不是使用i
{Object.keys(subjects).map((keyName, i) => (
<li className="travelcompany-input" key={i}>
<span className="input-label">key: {i} Name: {subjects[keyName]}</span>
</li>
))}
这篇关于如何通过ReactJS中的对象进行映射?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本站部分内容来源互联网,如果有图片或者内容侵犯您的权益请联系我们删除!