如何在映射的react函数中找到上一个元素

Question

我在react中的map函数中定位前一个元素时遇到了麻烦。当对象数组中的前一个元素不等于当前元素时，我想更改HTML中的ID标记。我没有成功地将这两个对象数组元素相互比较。我试过循环&映射和似乎不断得到未定义或NAN。

我不确定这是否是正确的方法来处理这样的事情。在网上也找不到什么能帮我的。谢谢你的帮助。

Array是如何设置的

Array(4) [ {…}, {…}, {…}, {…}]

1: Object { id: 2, productName: "Zirconium Flap Disc, 4 1/2 x 7/8 x 40 Grit, Pk 5", … }
​
2: Object { id: 3, productName: "Zirconium Flap Disc, 4 1/2 x 7/8 x 60 Grit, Pk 5", … }
​
3: Object { id: 4,  productName: "Zirconium Flap Disc, 4 1/2 x 7/8 x 80 Grit, Pk 5", … }
​
4: Object { id: 5,  productName: "Zirconium Flap Disc, 4 1/2 x 7/8 x 120 Grit, Pk 5", … }

尝试比较第一个对象数组中的Product Name和第二个对象数组中的productName，以此类推。1与2比较，2与3比较，3与4比较，以此类推。

1.
products.map((item,i)=>{
return(
<div className="pwrap" key={i} id={item[i].productName !== item[i-1].productName ? "line" : null}>
)
})

2. 
const compare = ()=>{
for(let i=0; i < props.products.length; i++){
let current = props.products[i]
let pre = current[-1].productName
return pre
}
}

Answer 1

您在第一个代码片段中有一个错误，您试图索引单个项目而不是数组。应该是:

products.map((item,i)=>{
return(
<div className="pwrap" key={i} id={products[i].productName !== products[i-1].productName ? "line" : null}>
)
})

虽然你需要添加一些条件逻辑来确保你没有索引products[-1]