Toggle through Reactjs Mapped Array

I'm trying to figure out how to only show one item in my array at a time and then click back and fourth through them using to buttons. Currently right now if there are 4 items in the array all 4 are shown on the page. But I'd like to show them one at a time and then be back to click back and fourth through them. I've built this using hooks.

Here is my current code:

<div>   {[...Array(stepBlock)].map((e, i) =>      <div className={'stepBlock'} key={i}>          <div>{details[i].name}</div>     </div>   )}   </div>   <div>      <div>previous</div>      <div>next</div>     </div>  

Any help would be greatly appreciated.

https://stackoverflow.com/questions/66995928/toggle-through-reactjs-mapped-array April 08, 2021 at 08:47AM