• Jobs
  • About Us
  • professionals
    • Home
    • Jobs
    • Courses and challenges
  • business
    • Home
    • Post vacancy
    • Our process
    • Pricing
    • Assessments
    • Payroll
    • Blog
    • Sales
    • Salary Calculator

0

151
Views
mostrando información mientras se mapea dentro de la matriz para la fecha dentro de un objeto sin repetir nombres

entonces quiero mostrar una tabla que muestre el estado de asistencia en un día para un jugador específico (presente, ausente, enfermo, lesionado, tarde). en cada objeto tenemos el jugador y el estado de ese día.

Esta es la estructura que elijo porque parece la mejor para enviar incluso para el back-end. pero no estoy seguro si ese es el mejor. Si tiene alguna otra sugerencia para otra estructura, estaría encantado de escucharla.

Estoy luchando por mostrar el estado de la persona en la fecha específica. nose como mostrar el mapa para hacerlo

click para ver la tabla que debo hacer para una mejor visualización

por ahora solo necesito que se muestre en una cadena para el estado más tarde las cosas elegantes. Realmente agradecería si alguien pudiera echar un vistazo a esto

este es el enlace del código para que funcione mejor : https://stackblitz.com/edit/react-gdpfjh?file=src%2FApp.js

el código

 import React, { useState } from 'react'; import './style.css'; export default function App() { const [overall, setoverall] = useState([ { date: '01-01-2020', attendance: [ { playerName: 'Miri', playerId: '1', status: 'present' }, { playerName: 'Gimi', playerId: '2', status: 'absent' }, ], }, { date: '03-01-2020', attendance: [ { playerName: 'Miri', playerId: '1', status: 'absent' }, { playerName: 'Gimi', playerId: '2', status: 'absent' }, ], }, { date: '05-01-2020', attendance: [ { playerName: 'Miri', playerId: '1', status: 'present' }, { playerName: 'Gimi', playerId: '2', status: 'present' }, ], }, { date: '08-01-2020', attendance: [ { playerName: 'Miri', playerId: '1', status: 'present' }, { playerName: 'Gimi', playerId: '2', status: 'injured' }, ], }, ]); return ( <div> <table border="1px" width="100%"> <tbody> <tr> <th width="100px"></th> {overall.map((item) => ( <th key={item.date}>{item.date}</th> ))} </tr> {overall[0].attendance.map((item) => ( <tr key={item.playerId}> <td>{item.playerName}</td> <td>{item.status}</td> </tr> ))} </tbody> </table> </div> ); }
about 3 years ago · Santiago Gelvez
1 answers
Answer question

0

Necesitará sus jugadores de su pregunta anterior . Lo sé porque me hiciste un ping en la otra pregunta. Pero deberías agregar más contexto como dice David.

Puedes encontrar el código aquí

about 3 years ago · Santiago Gelvez Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Our process Sales
Legal
Terms and conditions Privacy policy
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recommend me some offers
I have an error