数据 ：
我有数组内部的数据，我尝试使用默认代码循环：
<div className="loop-container">
{
joblist.map((itemb,index) => (
<div>
</div>
))
}
</div>
我想先显示该数组的名称，（这是日期）然后显示该数组的组成，但出现错误：
joblist.map 不是函数
在react中循环一个对象？
IT技术
javascript
arrays
reactjs
2021-03-31 05:38:11
2个回答
我们不能直接在对象上使用map,filter首先我们需要从该对象获取一个数组（属性或属性值），然后只有我们可以。
你得到的数据不是数组，所以我们不能直接使用Array.prototype.map。您需要做的是首先使用Object.keys获取数组中的所有键。一旦你map在那个和内部map函数体上使用了数组，就使用另一个map来迭代值。
您也可以使用Object.values或Object.entries，但模式将与Object.keys() 不同。
像这样写：
<div className="loop-container">
{
Object.entries(joblist).map(([key, value]) => (
<div id={key}>
Date: {key}
{
value.map(el => <div key={el.id}> {el.created_time} </div> )
}
</div>
))
}
</div>
使用Object.entries检查此代码段：
let obj = {
'key1': [{a:1}, {a:2}, {a:3}],
'key2': [{a:4}, {a:5}, {a:6}],
'key3': [{a:7}, {a:8}, {a:9}]
};
Object.entries(obj).map(([key, value]) => {
console.log('key name = ', key);
value.map(el => {
console.log(el.a);
})
})使用Object.keys检查此代码段：
let obj = {
'key1': [{a:1}, {a:2}, {a:3}],
'key2': [{a:4}, {a:5}, {a:6}],
'key3': [{a:7}, {a:8}, {a:9}]
};
Object.keys(obj).map(key => {
console.log('key name = ', key);
obj[key].map(el => {
console.log(el.a);
})
})使用Object.values检查此代码段：
let obj = {
'key1': [{a:1}, {a:2}, {a:3}],
'key2': [{a:4}, {a:5}, {a:6}],
'key3': [{a:7}, {a:8}, {a:9}]
};
Object.values(obj).map(value => {
console.log('value = ', JSON.stringify(value));
value.map(el => {
console.log(el.a);
})
})如您所见joblist，它不是数组，而是对象。如果你真的想使用，map那么你可以使用new Map(). 在新的地图（）构造函数接受一个可迭代的条目。使用Object.entries，您可以轻松地从 Object 转换为 Map：
var mapjoblist = new Map(Object.entries(joblist));
<div className="loop-container">
{mapjoblist.map((itemb,index) => (
<div>
.......
</div>
))}
</div>