Is that possible navigate to previous item, inside a map using React, I would like to parer the actual iteration with before, if the before have different group, per example, I will show the new one.

I would like to do something like that:

{navigation.map((item, i) => {
  return(
    <li key={i}>
      {i > 0 && item[i].groupName != item[i - 1].groupName && <div>Another group: {item[i].groupName}</div>}
    </li>
  )
})}

Is that possible navigate to previous item, inside a map using React, I would like to parer the actual iteration with before, if the before have different group, per example, I will show the new one.

I would like to do something like that:

{navigation.map((item, i) => {
  return(
    <li key={i}>
      {i > 0 && item[i].groupName != item[i - 1].groupName && <div>Another group: {item[i].groupName}</div>}
    </li>
  )
})}

• javascript
• reactjs
• typescript

Share Improve this question Follow edited Jan 31, 2018 at 23:13 asked Jan 31, 2018 at 23:06 user8321027user8321027 6

• What is before? – zerkms Commented Jan 31, 2018 at 23:07
• the item before the actual in the loop, sorry for my english x( – user8321027 Commented Jan 31, 2018 at 23:10
• Then what does "navigate to the previous item" mean? – zerkms Commented Jan 31, 2018 at 23:10
• I tried show a code sample – user8321027 Commented Jan 31, 2018 at 23:10
• I would like to acces the previous item in the array, example items[1,2,3,4,5], my iteration if was in the third I would like to pare with the second, like my sample – user8321027 Commented Jan 31, 2018 at 23:13

 |  Show 1 more ment

1 Answer 1

Sorted by: Reset to default 7

Yes, but it is not React-specific. It is JavaScript Array.map.

{navigation.map((item, i, arr) => {
  const previousItem = arr[i - 1];
  return(
    <li key={i}>
      {i > 0 && item[i].groupName != item[i - 1].groupName && <div>Another group: {item[i].groupName}</div>}
    </li>
  )
})}