I'm creating an audio player and I have a json list with tracks' data such as the name of the track.
I have a state (curTrack) that keeps track of which track I currently am (starts at 0 and add or remove 1 when I change track so, for example, the 14th track sets curTrack to 13)

I'm trying to create a list of all the tracks but I'm stuck because I don't know how to modify curTrack because I need to change this number to the corresponding track when I click on the track's name so I'm thinking that I need to associate the curTrack number of the track to its name but I don't know how I can do that.

Here's the sandbox

CodePudding user response：

For example:

const chooseTrack = (m) => { setSelectedTrack(m?.name); };

and change the button to:

<button key="m?.name" onClick={() => chooseTrack(m)}>

CodePudding user response：

I have Edit the Code Sandbox which contains how you can map Id and Name Sandbox

Please have a look might it solve your problem.