map in array object with index of other map parameter

Question

this is my code:

{seasons.map(k => (
    <TabPanel key={k} className="list-episode">
         <Scrollbars style={{ height: this.state.screenSize }}>
             {arrEpisodes[k].map(i => (
                  <div key={i.ID} className="episode">

but, the line {arrEpisodes[k]... not work, why?

Answer 1

Change

    {seasons.map(k => (
<TabPanel key={k} className="list-episode">
     <Scrollbars style={{ height: this.state.screenSize }}>
         {arrEpisodes[k].map(i => (
              <div key={i.ID} className="episode">

To

  {seasons.map((k, index)=> (
<TabPanel key={k.ID} className="list-episode">
     <Scrollbars style={{ height: this.state.screenSize }}>
         {arrEpisodes[index].map(i => (
              <div key={i.ID} className="episode">

The issue here is you are using data as index position to arrEpisodes array instead of index and that's why it fails. You need to pass index of seasons array to arrEpisodes array. Also set id as key to TabPanel instead of Object Ie, k in your code