He estado aprendiendo a trabajar con la función .map(), ya que se usa con bastante frecuencia para tratar con los resultados de la API,

Sin embargo, tengo algunas preguntas que no pude resolver por mi cuenta:

 <div className="boxer"> {users.map((user) => ( <div className="scoreBoxx" key={user.id} id={user.id}> <h2 className="CardTitle">{user.videogame.name}</h2> {user.opponents.map((sub) => <p key={sub.id} className={sub.acronym}> <b>Team :</b> {sub.opponent.name} </p> )} </div>

Esto está imprimiendo datos para mí de esta manera:

Equipo : Zdrastvyte Timur
Equipo: xStiKz

Lo que estoy tratando de lograr es:

Equipo : ZdrastvyteTimur - xStiKz

Así es como se ven mis datos:

Pido disculpas si esta pregunta se ha hecho antes, he intentado buscar pero no pude encontrar nada similar.

También intenté solucionar mi problema usando slice() pero aún no he podido resolverlo,