React处理多组数据时,时常会用到遍历来处理数据,在这里记录下两种方法。
1.map处理数据
map方法处理数据之后会返回一个新的数组,同时不会改变原数组的值;如果数组为空则无法进行遍历,所以要对数组做非空校验。
{
subSystem.list.length>0 && subSystem.list.map((item)=>{
return <Breadcrumb.Item className={styles.breadCrumbItem}>
<a href="#" onClick={() => {
window.open(item.systemUrl)
}}>{item.systemName}</a>
</Breadcrumb.Item>
})
}
2.forEach处理数据
forEach方法用于遍历数组中的每个元素。
//遍历数组匹配数据
caseAnalysis.list.forEach((item)=>{
if(year ===item.year && month === item.month) {
if (item.serviceFieldType === '01') {
civilvalues.push(
{
name: this.state.serviceField[item.serviceField],
value: item.involvedFieldCount,
}
)
if (item.involvedFieldCount > maxval) {
maxval = item.involvedFieldCount
}
} else if (item.serviceFieldType === '02') {
administrationvalues.push(
{
name: this.state.serviceField[item.serviceField],
value: item.involvedFieldCount,
}
)
if (item.involvedFieldCount > maxval) {
maxval = item.involvedFieldCount
}
}
}
});