How to display text only once per item iterated in React map-CodePudding

I am trying to display text only once per iteration block, but it keeps displaying depending on how many indexed there are iterated.

How can I explain only once?

This is my code:

someArr.map((col, i) => {
  return (
    <div
      key={i}
    >
      {text} // should be displayed only ONCE
      {someRule === someOtherRule && (
        <Icon/>
      )}
   </div>
 )
})

So what happens here is that Icon and all other items get displayed correctly, but {text} gets displayed depending on how many there are iterations. How can I display it only once, regardless of iteration count?

CodePudding user response：

Check for the first index

  {i === 0 ? text: ''}