Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

232
Vistas
Ordena una matriz de objetos en React y renderízalos

Tengo una serie de objetos que contienen alguna información. No puedo renderizarlos en el orden que quiero y necesito ayuda con eso. Los renderizo así:

 this.state.data.map( (item, i) => <div key={i}> {item.matchID} {item.timeM} {item.description}</div> )

¿Es posible ordenarlos de forma ascendente con item.timeM en esa función map() o tengo que ordenarlos antes de usar el mapa?

over 4 years ago · Santiago Trujillo
3 Respuestas
Responde la pregunta

0

Esto podría ser lo que estás buscando:

 // ... rest of code // copy your state.data to a new array and sort it by itemM in ascending order // and then map const myData = [].concat(this.state.data) .sort((a, b) => a.itemM > b.itemM ? 1 : -1) .map((item, i) => <div key={i}> {item.matchID} {item.timeM}{item.description}</div> ); // render your data here...

El método sort mutará la matriz original . Por lo tanto, creo una nueva matriz utilizando el método concat . La clasificación en el campo itemM debería funcionar en entidades clasificables como cadenas y números.

over 4 years ago · Santiago Trujillo Denunciar

0

Deberá ordenar su objeto antes de mapear sobre ellos. Y se puede hacer fácilmente con una función sort() con una definición de comparador personalizada como

 var obj = [...this.state.data]; obj.sort((a,b) => a.timeM - b.timeM); obj.map((item, i) => (<div key={i}> {item.matchID} {item.timeM} {item.description}</div>))
over 4 years ago · Santiago Trujillo Denunciar

0

this.state.data.sort((a, b) => a.item.timeM > b.item.timeM).map( (item, i) => <div key={i}> {item.matchID} {item.timeM} {item.description}</div> )
over 4 years ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda